@datatechsolutions/ui 2.11.24 → 2.11.26

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.
@@ -5557,22 +5557,390 @@ var StatusBadge = React12.forwardRef(function StatusBadge2({ status, label, size
5557
5557
  }
5558
5558
  );
5559
5559
  });
5560
+ function ProfileIdentityCard({
5561
+ displayName,
5562
+ profileInitial,
5563
+ avatarUrl,
5564
+ email,
5565
+ showEmail,
5566
+ role
5567
+ }) {
5568
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rounded-2xl liquid-surface p-4", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
5569
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "inline-flex h-12 w-12 items-center justify-center rounded-full bg-indigo-500/20 text-indigo-600 dark:text-indigo-300", children: avatarUrl ? (
5570
+ // eslint-disable-next-line @next/next/no-img-element
5571
+ /* @__PURE__ */ jsxRuntime.jsx("img", { src: avatarUrl, alt: displayName, className: "h-12 w-12 rounded-full object-cover" })
5572
+ ) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-lg font-semibold", children: profileInitial }) }),
5573
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
5574
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-base font-semibold text-slate-900 dark:text-white", children: displayName }),
5575
+ showEmail ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm text-slate-500 dark:text-slate-400", children: email ?? "" }) : null,
5576
+ role ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-1 text-xs font-medium uppercase tracking-wide text-slate-500 dark:text-slate-400", children: role }) : null
5577
+ ] })
5578
+ ] }) });
5579
+ }
5580
+ var SidebarContext = React12.createContext(null);
5581
+ var SIDEBAR_TYPE = /* @__PURE__ */ Symbol("GlassModal.Sidebar");
5582
+ var SECTION_TYPE = /* @__PURE__ */ Symbol("GlassModal.Section");
5583
+ var GROUP_TYPE = /* @__PURE__ */ Symbol("GlassModal.Group");
5584
+ var IDENTITY_TYPE = /* @__PURE__ */ Symbol("GlassModal.Identity");
5585
+ var SIDEBAR_FOOTER_TYPE = /* @__PURE__ */ Symbol("GlassModal.SidebarFooter");
5586
+ var FOOTER_TYPE = /* @__PURE__ */ Symbol("GlassModal.Footer");
5587
+ function Section({ children }) {
5588
+ return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
5589
+ }
5590
+ Section.__type = SECTION_TYPE;
5591
+ function Group({ children }) {
5592
+ return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
5593
+ }
5594
+ Group.__type = GROUP_TYPE;
5595
+ function Identity(_props) {
5596
+ return null;
5597
+ }
5598
+ Identity.__type = IDENTITY_TYPE;
5599
+ function SidebarFooterSlot({ children }) {
5600
+ return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
5601
+ }
5602
+ SidebarFooterSlot.__type = SIDEBAR_FOOTER_TYPE;
5603
+ function Sidebar(_props) {
5604
+ return null;
5605
+ }
5606
+ Sidebar.__type = SIDEBAR_TYPE;
5607
+ function FooterSlot({ children }) {
5608
+ return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children });
5609
+ }
5610
+ FooterSlot.__type = FOOTER_TYPE;
5611
+ function isSlotType(child, type) {
5612
+ return child.type?.__type === type;
5613
+ }
5614
+ function findSlot(children, type) {
5615
+ const arr = React12.Children.toArray(children);
5616
+ return arr.find((c) => React12.isValidElement(c) && isSlotType(c, type));
5617
+ }
5618
+ function filterNonSlots(children) {
5619
+ return React12.Children.toArray(children).filter(
5620
+ (c) => !(React12.isValidElement(c) && c.type?.__type)
5621
+ );
5622
+ }
5623
+ var SIZE_CLASSES2 = {
5624
+ sm: "max-w-sm",
5625
+ md: "max-w-md",
5626
+ lg: "max-w-lg",
5627
+ xl: "max-w-xl",
5628
+ "2xl": "max-w-2xl",
5629
+ "3xl": "max-w-3xl",
5630
+ "4xl": "max-w-4xl",
5631
+ "5xl": "max-w-5xl",
5632
+ "6xl": "max-w-6xl",
5633
+ full: "max-w-[90vw]"
5634
+ };
5635
+ function AccentBar({ gradient, className }) {
5636
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { className: `h-1.5 w-full bg-gradient-to-r ${gradient} ${className ?? ""}` });
5637
+ }
5638
+ function CloseBtn({ onClick, label }) {
5639
+ return /* @__PURE__ */ jsxRuntime.jsx(
5640
+ "button",
5641
+ {
5642
+ type: "button",
5643
+ onClick,
5644
+ "aria-label": label,
5645
+ "data-testid": "modal-close",
5646
+ className: "absolute right-4 top-4 z-10 inline-flex h-9 w-9 items-center justify-center rounded-xl text-slate-400 transition hover:bg-white/40 hover:text-slate-700 dark:hover:bg-white/[0.08] dark:hover:text-white focus-visible:ring-2 focus-visible:ring-blue-500 focus-visible:ring-offset-2",
5647
+ children: /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.XMarkIcon, { className: "h-5 w-5" })
5648
+ }
5649
+ );
5650
+ }
5651
+ function SidebarLayout({
5652
+ sidebarElement,
5653
+ gradient,
5654
+ icon,
5655
+ label,
5656
+ title,
5657
+ subtitle,
5658
+ onClose,
5659
+ closeLabel,
5660
+ footer,
5661
+ className
5662
+ }) {
5663
+ const sidebarChildren = sidebarElement.props.children;
5664
+ const defaultSection = sidebarElement.props.defaultSection;
5665
+ const identityEl = findSlot(sidebarChildren, IDENTITY_TYPE);
5666
+ const sidebarFooterEl = findSlot(sidebarChildren, SIDEBAR_FOOTER_TYPE);
5667
+ const sections = [];
5668
+ function collectSections(node, group) {
5669
+ React12.Children.forEach(node, (child) => {
5670
+ if (!React12.isValidElement(child)) return;
5671
+ if (isSlotType(child, GROUP_TYPE)) {
5672
+ const groupProps = child.props;
5673
+ collectSections(groupProps.children, groupProps.label);
5674
+ } else if (isSlotType(child, SECTION_TYPE)) {
5675
+ const sectionProps = child.props;
5676
+ sections.push({
5677
+ id: sectionProps.id,
5678
+ icon: sectionProps.icon,
5679
+ label: sectionProps.label,
5680
+ badge: sectionProps.badge,
5681
+ content: sectionProps.children,
5682
+ group
5683
+ });
5684
+ }
5685
+ });
5686
+ }
5687
+ collectSections(sidebarChildren);
5688
+ const [activeSectionId, setActiveSectionId] = React12.useState(defaultSection ?? sections[0]?.id ?? "");
5689
+ const groups = [];
5690
+ for (const section of sections) {
5691
+ const lastGroup = groups.at(-1);
5692
+ if (!lastGroup || lastGroup.label !== section.group) {
5693
+ groups.push({ label: section.group, items: [section] });
5694
+ } else {
5695
+ lastGroup.items.push(section);
5696
+ }
5697
+ }
5698
+ const activeContent = sections.find((s) => s.id === activeSectionId)?.content;
5699
+ const identityProps = identityEl?.props;
5700
+ return /* @__PURE__ */ jsxRuntime.jsx(SidebarContext.Provider, { value: { activeSectionId, setActiveSectionId }, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `relative flex h-[min(94vh,920px)] flex-col lg:flex-row ${className}`, children: [
5701
+ /* @__PURE__ */ jsxRuntime.jsxs("aside", { className: "relative flex w-full shrink-0 flex-col border-b border-white/25 bg-gradient-to-b from-white/40 via-white/20 to-white/10 dark:border-white/8 dark:from-white/[0.06] dark:via-white/[0.03] dark:to-transparent lg:w-80 lg:border-b-0 lg:border-r lg:border-white/20 lg:dark:border-white/8", children: [
5702
+ gradient && /* @__PURE__ */ jsxRuntime.jsx(AccentBar, { gradient, className: "rounded-tl-2xl lg:rounded-tr-none" }),
5703
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-5 p-5 pb-0 pr-12", children: [
5704
+ icon || label ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-3 flex items-center gap-3", children: [
5705
+ icon && /* @__PURE__ */ jsxRuntime.jsx("div", { className: `flex h-10 w-10 items-center justify-center rounded-xl shadow-lg ${gradient ? `bg-gradient-to-br ${gradient}` : "bg-gradient-to-br from-slate-500 to-gray-600"}`, children: icon }),
5706
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[11px] font-semibold uppercase tracking-[0.22em] text-slate-500 dark:text-slate-400", children: label ?? "Settings" })
5707
+ ] }) : /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-1 text-[11px] font-semibold uppercase tracking-[0.22em] text-slate-500 dark:text-slate-400", children: "Settings" }),
5708
+ /* @__PURE__ */ jsxRuntime.jsx("h2", { id: "modal-title", className: "text-2xl font-semibold text-slate-950 dark:text-white", children: title }),
5709
+ subtitle && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1.5 text-sm text-slate-600 dark:text-slate-400", children: subtitle })
5710
+ ] }),
5711
+ identityProps && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-5", children: /* @__PURE__ */ jsxRuntime.jsx(
5712
+ ProfileIdentityCard,
5713
+ {
5714
+ displayName: identityProps.name,
5715
+ profileInitial: identityProps.initial ?? identityProps.name.charAt(0).toUpperCase(),
5716
+ avatarUrl: identityProps.avatar,
5717
+ email: identityProps.email,
5718
+ role: identityProps.role,
5719
+ showEmail: identityProps.showEmail ?? true
5720
+ }
5721
+ ) }),
5722
+ /* @__PURE__ */ jsxRuntime.jsx("nav", { className: "mt-5 flex-1 space-y-6 overflow-y-auto px-5 pr-4", "aria-label": title, children: groups.map((group) => /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
5723
+ group.label && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-2 px-1 text-[11px] font-semibold uppercase tracking-[0.18em] text-slate-500 dark:text-slate-500", children: group.label }),
5724
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-1.5", children: group.items.map((section) => {
5725
+ const Icon = section.icon;
5726
+ const isActive = activeSectionId === section.id;
5727
+ return /* @__PURE__ */ jsxRuntime.jsxs(
5728
+ "button",
5729
+ {
5730
+ type: "button",
5731
+ onClick: () => setActiveSectionId(section.id),
5732
+ className: `flex w-full items-center gap-3 rounded-2xl px-4 py-3 text-left text-sm font-medium transition-all duration-200 ${isActive ? "liquid-surface liquid-surface-active text-slate-950 dark:text-white" : "text-slate-600 hover:bg-white/30 hover:text-slate-950 dark:text-slate-300 dark:hover:bg-white/[0.06] dark:hover:text-white"}`,
5733
+ children: [
5734
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "inline-flex h-10 w-10 items-center justify-center rounded-2xl bg-white/50 text-slate-600 shadow-sm backdrop-blur-sm dark:bg-white/[0.08] dark:text-slate-300", children: /* @__PURE__ */ jsxRuntime.jsx(Icon, { className: "h-5 w-5" }) }),
5735
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1", children: section.label }),
5736
+ section.badge != null && section.badge > 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "inline-flex h-5 min-w-5 items-center justify-center rounded-full bg-indigo-100 px-1.5 text-[10px] font-bold text-indigo-700 dark:bg-indigo-500/20 dark:text-indigo-300", children: section.badge })
5737
+ ]
5738
+ },
5739
+ section.id
5740
+ );
5741
+ }) })
5742
+ ] }, group.label ?? group.items.map((s) => s.id).join("-"))) }),
5743
+ sidebarFooterEl && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-4 px-5", children: sidebarFooterEl.props.children })
5744
+ ] }),
5745
+ /* @__PURE__ */ jsxRuntime.jsxs("section", { className: "relative flex min-h-0 flex-1 flex-col", children: [
5746
+ gradient ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "hidden lg:block", children: /* @__PURE__ */ jsxRuntime.jsx(AccentBar, { gradient }) }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-x-6 top-0 h-px bg-gradient-to-r from-transparent via-white/50 to-transparent dark:via-white/10" }),
5747
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: `flex min-h-0 flex-1 flex-col overflow-y-auto px-6 sm:px-8 lg:px-10 ${gradient ? "pt-8" : "pt-16"} ${footer ? "pb-4" : "pb-8 lg:pb-10"}`, children: activeContent }),
5748
+ footer && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-t border-white/20 px-6 py-4 dark:border-white/10 sm:px-8 lg:px-10", children: footer })
5749
+ ] }),
5750
+ /* @__PURE__ */ jsxRuntime.jsx(CloseBtn, { onClick: onClose, label: closeLabel })
5751
+ ] }) });
5752
+ }
5753
+ function PropBasedSidebarLayout({
5754
+ sidebar,
5755
+ gradient,
5756
+ icon,
5757
+ label,
5758
+ title,
5759
+ subtitle,
5760
+ onClose,
5761
+ closeLabel,
5762
+ footer,
5763
+ children
5764
+ }) {
5765
+ const groups = [];
5766
+ for (const section of sidebar.sections) {
5767
+ const lastGroup = groups.at(-1);
5768
+ if (!lastGroup || lastGroup.label !== section.group) {
5769
+ groups.push({ label: section.group, items: [section] });
5770
+ } else {
5771
+ lastGroup.items.push(section);
5772
+ }
5773
+ }
5774
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex h-[min(94vh,920px)] flex-col lg:flex-row", children: [
5775
+ /* @__PURE__ */ jsxRuntime.jsxs("aside", { className: "relative flex w-full shrink-0 flex-col border-b border-white/25 bg-gradient-to-b from-white/40 via-white/20 to-white/10 dark:border-white/8 dark:from-white/[0.06] dark:via-white/[0.03] dark:to-transparent lg:w-80 lg:border-b-0 lg:border-r lg:border-white/20 lg:dark:border-white/8", children: [
5776
+ gradient && /* @__PURE__ */ jsxRuntime.jsx(AccentBar, { gradient, className: "rounded-tl-2xl lg:rounded-tr-none" }),
5777
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-5 p-5 pb-0 pr-12", children: [
5778
+ icon || label ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-3 flex items-center gap-3", children: [
5779
+ icon && /* @__PURE__ */ jsxRuntime.jsx("div", { className: `flex h-10 w-10 items-center justify-center rounded-xl shadow-lg ${gradient ? `bg-gradient-to-br ${gradient}` : "bg-gradient-to-br from-slate-500 to-gray-600"}`, children: icon }),
5780
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[11px] font-semibold uppercase tracking-[0.22em] text-slate-500 dark:text-slate-400", children: label ?? "Settings" })
5781
+ ] }) : /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-1 text-[11px] font-semibold uppercase tracking-[0.22em] text-slate-500 dark:text-slate-400", children: "Settings" }),
5782
+ /* @__PURE__ */ jsxRuntime.jsx("h2", { id: "modal-title", className: "text-2xl font-semibold text-slate-950 dark:text-white", children: title }),
5783
+ subtitle && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1.5 text-sm text-slate-600 dark:text-slate-400", children: subtitle })
5784
+ ] }),
5785
+ sidebar.identity && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-5", children: /* @__PURE__ */ jsxRuntime.jsx(
5786
+ ProfileIdentityCard,
5787
+ {
5788
+ displayName: sidebar.identity.displayName,
5789
+ profileInitial: sidebar.identity.profileInitial,
5790
+ avatarUrl: sidebar.identity.avatarUrl,
5791
+ email: sidebar.identity.email,
5792
+ role: sidebar.identity.role,
5793
+ showEmail: sidebar.identity.showEmail ?? true
5794
+ }
5795
+ ) }),
5796
+ /* @__PURE__ */ jsxRuntime.jsx("nav", { className: "mt-5 flex-1 space-y-6 overflow-y-auto px-5 pr-4", "aria-label": title, children: groups.map((group) => /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
5797
+ group.label && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-2 px-1 text-[11px] font-semibold uppercase tracking-[0.18em] text-slate-500 dark:text-slate-500", children: group.label }),
5798
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-1.5", children: group.items.map((section) => {
5799
+ const Icon = section.icon;
5800
+ const isActive = sidebar.activeSectionId === section.id;
5801
+ return /* @__PURE__ */ jsxRuntime.jsxs(
5802
+ "button",
5803
+ {
5804
+ type: "button",
5805
+ onClick: () => sidebar.onSectionChange(section.id),
5806
+ className: `flex w-full items-center gap-3 rounded-2xl px-4 py-3 text-left text-sm font-medium transition-all duration-200 ${isActive ? "liquid-surface liquid-surface-active text-slate-950 dark:text-white" : "text-slate-600 hover:bg-white/30 hover:text-slate-950 dark:text-slate-300 dark:hover:bg-white/[0.06] dark:hover:text-white"}`,
5807
+ children: [
5808
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "inline-flex h-10 w-10 items-center justify-center rounded-2xl bg-white/50 text-slate-600 shadow-sm backdrop-blur-sm dark:bg-white/[0.08] dark:text-slate-300", children: /* @__PURE__ */ jsxRuntime.jsx(Icon, { className: "h-5 w-5" }) }),
5809
+ /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1", children: section.label }),
5810
+ section.badge != null && section.badge > 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "inline-flex h-5 min-w-5 items-center justify-center rounded-full bg-indigo-100 px-1.5 text-[10px] font-bold text-indigo-700 dark:bg-indigo-500/20 dark:text-indigo-300", children: section.badge })
5811
+ ]
5812
+ },
5813
+ section.id
5814
+ );
5815
+ }) })
5816
+ ] }, group.label ?? group.items.map((s) => s.id).join("-"))) }),
5817
+ sidebar.footer && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-4 px-5", children: sidebar.footer })
5818
+ ] }),
5819
+ /* @__PURE__ */ jsxRuntime.jsxs("section", { className: "relative flex min-h-0 flex-1 flex-col", children: [
5820
+ gradient ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "hidden lg:block", children: /* @__PURE__ */ jsxRuntime.jsx(AccentBar, { gradient }) }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-x-6 top-0 h-px bg-gradient-to-r from-transparent via-white/50 to-transparent dark:via-white/10" }),
5821
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: `flex min-h-0 flex-1 flex-col overflow-y-auto px-6 sm:px-8 lg:px-10 ${gradient ? "pt-8" : "pt-16"} ${footer ? "pb-4" : "pb-8 lg:pb-10"}`, children }),
5822
+ footer && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-t border-white/20 px-6 py-4 dark:border-white/10 sm:px-8 lg:px-10", children: footer })
5823
+ ] }),
5824
+ /* @__PURE__ */ jsxRuntime.jsx(CloseBtn, { onClick: onClose, label: closeLabel })
5825
+ ] });
5826
+ }
5560
5827
  function GlassModal({
5561
5828
  open,
5562
5829
  onClose,
5830
+ gradient,
5831
+ icon,
5832
+ label,
5833
+ title,
5834
+ subtitle,
5835
+ headerActions,
5563
5836
  children,
5564
- panelClassName = "rounded-[2rem]",
5565
- contentClassName = "fixed inset-0 flex items-center justify-center overflow-y-auto p-3 sm:p-5 lg:p-6",
5837
+ footer,
5838
+ onSubmit,
5839
+ showFormFooter,
5840
+ cancelLabel,
5841
+ submitLabel,
5842
+ isLoading = false,
5843
+ submitDisabled = false,
5844
+ sidebar,
5845
+ maxWidth = "4xl",
5846
+ closeLabel = "Close",
5847
+ className = "",
5566
5848
  zIndex = "z-50",
5849
+ panelClassName,
5850
+ contentClassName,
5567
5851
  overlayTestId,
5568
- panelTestId,
5569
- ariaLabelledBy
5852
+ panelTestId
5570
5853
  }) {
5571
- return /* @__PURE__ */ jsxRuntime.jsxs(Headless6.Dialog, { open, onClose, className: `relative ${zIndex}`, "aria-labelledby": ariaLabelledBy, children: [
5854
+ const hasTitle = !!title;
5855
+ const sidebarElement = React12.Children.toArray(children).find(
5856
+ (c) => React12.isValidElement(c) && isSlotType(c, SIDEBAR_TYPE)
5857
+ );
5858
+ const footerElement = findSlot(children, FOOTER_TYPE);
5859
+ const nonSlotChildren = filterNonSlots(children);
5860
+ const resolvedFooter = footer ?? (footerElement ? footerElement.props.children : void 0) ?? (showFormFooter ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col sm:flex-row justify-end gap-2 sm:gap-3", children: [
5861
+ /* @__PURE__ */ jsxRuntime.jsx(Button, { type: "button", onClick: onClose, disabled: isLoading, outline: true, className: "w-full sm:w-auto", "data-testid": "form-modal-cancel", children: cancelLabel ?? "Cancel" }),
5862
+ /* @__PURE__ */ jsxRuntime.jsx(Button, { type: "submit", disabled: submitDisabled, loading: isLoading, loadingText: submitLabel, color: "ios-glass-blue", className: "w-full sm:w-auto", "data-testid": "form-modal-submit", children: submitLabel ?? "Save" })
5863
+ ] }) : void 0);
5864
+ const handleSubmit = React12.useCallback((event) => {
5865
+ event.preventDefault();
5866
+ onSubmit?.(event);
5867
+ }, [onSubmit]);
5868
+ if (!hasTitle) {
5869
+ return /* @__PURE__ */ jsxRuntime.jsxs(Headless6.Dialog, { open, onClose, className: `relative ${zIndex}`, children: [
5870
+ /* @__PURE__ */ jsxRuntime.jsx(Headless6.DialogBackdrop, { className: "fixed inset-0 bg-slate-900/40 backdrop-blur-md dark:bg-black/50", "data-testid": overlayTestId }),
5871
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: contentClassName ?? "fixed inset-0 flex items-center justify-center overflow-y-auto p-3 sm:p-5 lg:p-6", children: /* @__PURE__ */ jsxRuntime.jsx(Headless6.DialogPanel, { className: panelClassName ?? "rounded-2xl", "data-testid": panelTestId, children }) })
5872
+ ] });
5873
+ }
5874
+ if (sidebar && !sidebarElement) {
5875
+ return /* @__PURE__ */ jsxRuntime.jsxs(Headless6.Dialog, { open, onClose, className: `relative ${zIndex}`, "aria-labelledby": "modal-title", children: [
5876
+ /* @__PURE__ */ jsxRuntime.jsx(Headless6.DialogBackdrop, { className: "fixed inset-0 bg-slate-900/40 backdrop-blur-md dark:bg-black/50", "data-testid": overlayTestId }),
5877
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "fixed inset-0 flex items-center justify-center overflow-y-auto p-2 sm:p-4 lg:p-6", children: /* @__PURE__ */ jsxRuntime.jsx(Headless6.DialogPanel, { className: `w-full max-w-[90vw] xl:max-w-[1400px] overflow-hidden rounded-2xl liquid-surface-strong shadow-[0_40px_100px_-30px_rgba(0,0,0,0.55)] ${className}`, "data-testid": panelTestId, children: /* @__PURE__ */ jsxRuntime.jsx(
5878
+ PropBasedSidebarLayout,
5879
+ {
5880
+ sidebar,
5881
+ gradient,
5882
+ icon,
5883
+ label,
5884
+ title,
5885
+ subtitle,
5886
+ onClose,
5887
+ closeLabel,
5888
+ footer: resolvedFooter,
5889
+ children: nonSlotChildren
5890
+ }
5891
+ ) }) })
5892
+ ] });
5893
+ }
5894
+ if (sidebarElement) {
5895
+ return /* @__PURE__ */ jsxRuntime.jsxs(Headless6.Dialog, { open, onClose, className: `relative ${zIndex}`, "aria-labelledby": "modal-title", children: [
5896
+ /* @__PURE__ */ jsxRuntime.jsx(Headless6.DialogBackdrop, { className: "fixed inset-0 bg-slate-900/40 backdrop-blur-md dark:bg-black/50", "data-testid": overlayTestId }),
5897
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "fixed inset-0 flex items-center justify-center overflow-y-auto p-2 sm:p-4 lg:p-6", children: /* @__PURE__ */ jsxRuntime.jsx(Headless6.DialogPanel, { className: `w-full max-w-[90vw] xl:max-w-[1400px] overflow-hidden rounded-2xl liquid-surface-strong shadow-[0_40px_100px_-30px_rgba(0,0,0,0.55)] ${className}`, "data-testid": panelTestId, children: /* @__PURE__ */ jsxRuntime.jsx(
5898
+ SidebarLayout,
5899
+ {
5900
+ sidebarElement,
5901
+ gradient,
5902
+ icon,
5903
+ label,
5904
+ title,
5905
+ subtitle,
5906
+ onClose,
5907
+ closeLabel,
5908
+ footer: resolvedFooter,
5909
+ className: ""
5910
+ }
5911
+ ) }) })
5912
+ ] });
5913
+ }
5914
+ const inner = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
5915
+ gradient && /* @__PURE__ */ jsxRuntime.jsx(AccentBar, { gradient }),
5916
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative px-5 pb-4 pt-5 sm:px-8 sm:pt-6", children: [
5917
+ /* @__PURE__ */ jsxRuntime.jsx(CloseBtn, { onClick: onClose, label: closeLabel }),
5918
+ (icon || label) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-2 flex items-center gap-2 text-slate-600 dark:text-white/70", children: [
5919
+ icon,
5920
+ label && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-medium", children: label })
5921
+ ] }),
5922
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap items-start justify-between gap-3 pr-10", children: [
5923
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
5924
+ /* @__PURE__ */ jsxRuntime.jsx("h2", { id: "modal-title", "data-testid": "modal-title", className: "text-xl font-bold text-slate-900 dark:text-white sm:text-2xl", children: title }),
5925
+ subtitle && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1 text-sm text-slate-500 dark:text-slate-400", children: subtitle })
5926
+ ] }),
5927
+ headerActions && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-2", children: headerActions })
5928
+ ] })
5929
+ ] }),
5930
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "max-h-[72vh] overflow-y-auto px-5 pb-5 sm:px-8 sm:pb-8", children: nonSlotChildren }),
5931
+ resolvedFooter && /* @__PURE__ */ jsxRuntime.jsx("div", { "data-testid": "modal-footer", className: "border-t border-white/20 px-5 py-4 dark:border-white/10 sm:px-8", children: resolvedFooter })
5932
+ ] });
5933
+ return /* @__PURE__ */ jsxRuntime.jsxs(Headless6.Dialog, { open, onClose, className: `relative ${zIndex}`, "aria-labelledby": "modal-title", children: [
5572
5934
  /* @__PURE__ */ jsxRuntime.jsx(Headless6.DialogBackdrop, { className: "fixed inset-0 bg-slate-900/40 backdrop-blur-md dark:bg-black/50", "data-testid": overlayTestId }),
5573
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: contentClassName, children: /* @__PURE__ */ jsxRuntime.jsx(Headless6.DialogPanel, { className: panelClassName, "data-testid": panelTestId, children }) })
5935
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "fixed inset-0 overflow-y-auto p-3 sm:p-6", children: /* @__PURE__ */ jsxRuntime.jsx(Headless6.DialogPanel, { className: `liquid-surface-strong w-full overflow-hidden rounded-2xl mx-auto mt-[4vh] sm:mt-[8vh] ${SIZE_CLASSES2[maxWidth]} ${className}`, "data-testid": panelTestId, children: onSubmit ? /* @__PURE__ */ jsxRuntime.jsx("form", { onSubmit: handleSubmit, children: inner }) : inner }) })
5574
5936
  ] });
5575
5937
  }
5938
+ GlassModal.Sidebar = Sidebar;
5939
+ GlassModal.Section = Section;
5940
+ GlassModal.Group = Group;
5941
+ GlassModal.Identity = Identity;
5942
+ GlassModal.SidebarFooter = SidebarFooterSlot;
5943
+ GlassModal.Footer = FooterSlot;
5576
5944
  function Text({ className, ...props }) {
5577
5945
  return /* @__PURE__ */ jsxRuntime.jsx(
5578
5946
  "p",
@@ -6031,143 +6399,6 @@ function FilterBadge({ count }) {
6031
6399
  function FeedItemCard({ children, className = "" }) {
6032
6400
  return /* @__PURE__ */ jsxRuntime.jsx("li", { className: `overflow-hidden rounded-2xl border shadow-sm transition-shadow hover:shadow-md ${className}`, children });
6033
6401
  }
6034
- var SIZE_CLASSES2 = {
6035
- sm: "max-w-sm",
6036
- md: "max-w-md",
6037
- lg: "max-w-lg",
6038
- xl: "max-w-xl",
6039
- "2xl": "max-w-2xl",
6040
- "3xl": "max-w-3xl",
6041
- "4xl": "max-w-4xl",
6042
- "5xl": "max-w-5xl",
6043
- "6xl": "max-w-6xl",
6044
- full: "max-w-[90vw]"
6045
- };
6046
- function GlassModalShell({
6047
- open,
6048
- onClose,
6049
- gradient,
6050
- icon,
6051
- label,
6052
- title,
6053
- subtitle,
6054
- headerActions,
6055
- children,
6056
- footer,
6057
- onSubmit,
6058
- maxWidth = "4xl",
6059
- closeLabel = "Close",
6060
- className = "",
6061
- zIndex
6062
- }) {
6063
- const handleSubmit = (event) => {
6064
- event.preventDefault();
6065
- onSubmit?.(event);
6066
- };
6067
- const inner = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
6068
- gradient && /* @__PURE__ */ jsxRuntime.jsx("div", { className: `h-1.5 w-full bg-gradient-to-r ${gradient}` }),
6069
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative px-5 pb-4 pt-5 sm:px-8 sm:pt-6", children: [
6070
- /* @__PURE__ */ jsxRuntime.jsx(
6071
- "button",
6072
- {
6073
- type: "button",
6074
- onClick: onClose,
6075
- "aria-label": closeLabel,
6076
- "data-testid": "modal-close",
6077
- className: "absolute right-4 top-4 inline-flex h-9 w-9 items-center justify-center rounded-xl text-slate-400 transition hover:bg-white/40 hover:text-slate-700 dark:hover:bg-white/[0.08] dark:hover:text-white focus-visible:ring-2 focus-visible:ring-blue-500 focus-visible:ring-offset-2",
6078
- children: /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.XMarkIcon, { className: "h-5 w-5" })
6079
- }
6080
- ),
6081
- (icon || label) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-2 flex items-center gap-2 text-slate-600 dark:text-white/70", children: [
6082
- icon,
6083
- label && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-medium", children: label })
6084
- ] }),
6085
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap items-start justify-between gap-3 pr-10", children: [
6086
- /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
6087
- /* @__PURE__ */ jsxRuntime.jsx("h2", { id: "modal-title", "data-testid": "modal-title", className: "text-xl font-bold text-slate-900 dark:text-white sm:text-2xl", children: title }),
6088
- subtitle && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1 text-sm text-slate-500 dark:text-slate-400", children: subtitle })
6089
- ] }),
6090
- headerActions && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-2", children: headerActions })
6091
- ] })
6092
- ] }),
6093
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "max-h-[72vh] overflow-y-auto px-5 pb-5 sm:px-8 sm:pb-8", children }),
6094
- footer && /* @__PURE__ */ jsxRuntime.jsx("div", { "data-testid": "modal-footer", className: "border-t border-white/20 px-5 py-4 dark:border-white/10 sm:px-8", children: footer })
6095
- ] });
6096
- return /* @__PURE__ */ jsxRuntime.jsx(
6097
- GlassModal,
6098
- {
6099
- open,
6100
- onClose,
6101
- contentClassName: "fixed inset-0 overflow-y-auto p-3 sm:p-6",
6102
- panelClassName: `liquid-surface-strong w-full overflow-hidden rounded-2xl mx-auto mt-[4vh] sm:mt-[8vh] ${SIZE_CLASSES2[maxWidth]} ${className}`,
6103
- ariaLabelledBy: "modal-title",
6104
- zIndex,
6105
- overlayTestId: "modal-overlay",
6106
- panelTestId: "modal-panel",
6107
- children: onSubmit ? /* @__PURE__ */ jsxRuntime.jsx("form", { onSubmit: handleSubmit, children: inner }) : inner
6108
- }
6109
- );
6110
- }
6111
- function GlassFormModal({
6112
- open,
6113
- onClose,
6114
- title,
6115
- subtitle,
6116
- icon,
6117
- children,
6118
- maxWidth = "4xl",
6119
- onSubmit,
6120
- footer,
6121
- showFooter = true,
6122
- cancelLabel,
6123
- submitLabel,
6124
- isLoading = false,
6125
- submitDisabled = false,
6126
- gradient
6127
- }) {
6128
- const defaultFooter = showFooter ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col sm:flex-row justify-end gap-2 sm:gap-3", children: footer || /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
6129
- /* @__PURE__ */ jsxRuntime.jsx(
6130
- Button,
6131
- {
6132
- type: "button",
6133
- onClick: onClose,
6134
- disabled: isLoading,
6135
- outline: true,
6136
- className: "w-full sm:w-auto",
6137
- "data-testid": "form-modal-cancel",
6138
- children: cancelLabel
6139
- }
6140
- ),
6141
- /* @__PURE__ */ jsxRuntime.jsx(
6142
- Button,
6143
- {
6144
- type: "submit",
6145
- disabled: submitDisabled,
6146
- loading: isLoading,
6147
- loadingText: submitLabel,
6148
- color: "ios-glass-blue",
6149
- className: "w-full sm:w-auto",
6150
- "data-testid": "form-modal-submit",
6151
- children: submitLabel
6152
- }
6153
- )
6154
- ] }) }) : void 0;
6155
- return /* @__PURE__ */ jsxRuntime.jsx("div", { "data-testid": "form-modal", role: "dialog", "aria-modal": "true", "aria-label": title, children: /* @__PURE__ */ jsxRuntime.jsx(
6156
- GlassModalShell,
6157
- {
6158
- open,
6159
- onClose,
6160
- title,
6161
- subtitle,
6162
- icon,
6163
- gradient,
6164
- maxWidth,
6165
- onSubmit,
6166
- footer: defaultFooter,
6167
- children
6168
- }
6169
- ) });
6170
- }
6171
6402
  function ContextMenu({
6172
6403
  position,
6173
6404
  onClose,
@@ -10251,190 +10482,6 @@ function PreferenceSection({
10251
10482
  children
10252
10483
  ] });
10253
10484
  }
10254
- function ProfileIdentityCard({
10255
- displayName,
10256
- profileInitial,
10257
- avatarUrl,
10258
- email,
10259
- showEmail,
10260
- role
10261
- }) {
10262
- return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rounded-2xl liquid-surface p-4", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
10263
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "inline-flex h-12 w-12 items-center justify-center rounded-full bg-indigo-500/20 text-indigo-600 dark:text-indigo-300", children: avatarUrl ? (
10264
- // eslint-disable-next-line @next/next/no-img-element
10265
- /* @__PURE__ */ jsxRuntime.jsx("img", { src: avatarUrl, alt: displayName, className: "h-12 w-12 rounded-full object-cover" })
10266
- ) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-lg font-semibold", children: profileInitial }) }),
10267
- /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
10268
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-base font-semibold text-slate-900 dark:text-white", children: displayName }),
10269
- showEmail ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm text-slate-500 dark:text-slate-400", children: email ?? "" }) : null,
10270
- role ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-1 text-xs font-medium uppercase tracking-wide text-slate-500 dark:text-slate-400", children: role }) : null
10271
- ] })
10272
- ] }) });
10273
- }
10274
- function GlassSidebarModal({
10275
- open,
10276
- onClose,
10277
- title,
10278
- subtitle,
10279
- gradient,
10280
- icon,
10281
- label,
10282
- sections,
10283
- activeSectionId,
10284
- onSectionChange,
10285
- children,
10286
- closeLabel = "Close",
10287
- identity,
10288
- sidebarFooter,
10289
- footer
10290
- }) {
10291
- const sectionGroups = sections.reduce((groups, section) => {
10292
- const currentGroup = groups.at(-1);
10293
- if (!currentGroup || currentGroup.label !== section.group) {
10294
- groups.push({
10295
- label: section.group,
10296
- sections: [section]
10297
- });
10298
- return groups;
10299
- }
10300
- currentGroup.sections.push(section);
10301
- return groups;
10302
- }, []);
10303
- return /* @__PURE__ */ jsxRuntime.jsx(
10304
- GlassModal,
10305
- {
10306
- open,
10307
- onClose,
10308
- contentClassName: "fixed inset-0 flex items-center justify-center overflow-y-auto p-2 sm:p-4 lg:p-6",
10309
- panelClassName: "w-full max-w-[90vw] xl:max-w-[1400px] overflow-hidden rounded-2xl liquid-surface-strong shadow-[0_40px_100px_-30px_rgba(0,0,0,0.55)]",
10310
- ariaLabelledBy: "settings-dialog-title",
10311
- children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex h-[min(94vh,920px)] flex-col lg:flex-row", children: [
10312
- /* @__PURE__ */ jsxRuntime.jsxs("aside", { className: "relative flex w-full shrink-0 flex-col border-b border-white/25 bg-gradient-to-b from-white/40 via-white/20 to-white/10 dark:border-white/8 dark:from-white/[0.06] dark:via-white/[0.03] dark:to-transparent lg:w-80 lg:border-b-0 lg:border-r lg:border-white/20 lg:dark:border-white/8", children: [
10313
- gradient ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: `h-1.5 w-full rounded-tl-2xl bg-gradient-to-r ${gradient} lg:rounded-tr-none` }) : null,
10314
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-x-5 top-0 h-px bg-gradient-to-r from-transparent via-white/70 to-transparent dark:via-white/12", style: gradient ? { top: "6px" } : void 0 }),
10315
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-5 p-5 pb-0 pr-12", children: [
10316
- icon || label ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-3 flex items-center gap-3", children: [
10317
- icon ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: `flex h-10 w-10 items-center justify-center rounded-xl shadow-lg ${gradient ? `bg-gradient-to-br ${gradient}` : "bg-gradient-to-br from-slate-500 to-gray-600"}`, children: icon }) : null,
10318
- label ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[11px] font-semibold uppercase tracking-[0.22em] text-slate-500 dark:text-slate-400", children: label }) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[11px] font-semibold uppercase tracking-[0.22em] text-slate-500 dark:text-slate-400", children: "Settings" })
10319
- ] }) : /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-1 text-[11px] font-semibold uppercase tracking-[0.22em] text-slate-500 dark:text-slate-400", children: "Settings" }),
10320
- /* @__PURE__ */ jsxRuntime.jsx("h2", { id: "settings-dialog-title", className: "text-2xl font-semibold text-slate-950 dark:text-white", children: title }),
10321
- subtitle ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1.5 text-sm text-slate-600 dark:text-slate-400", children: subtitle }) : null
10322
- ] }),
10323
- identity ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-5", children: /* @__PURE__ */ jsxRuntime.jsx(
10324
- ProfileIdentityCard,
10325
- {
10326
- displayName: identity.displayName,
10327
- profileInitial: identity.profileInitial,
10328
- avatarUrl: identity.avatarUrl,
10329
- email: identity.email,
10330
- role: identity.role,
10331
- showEmail: identity.showEmail ?? true
10332
- }
10333
- ) }) : null,
10334
- /* @__PURE__ */ jsxRuntime.jsx("nav", { className: "mt-5 flex-1 space-y-6 overflow-y-auto px-5 pr-4", "aria-label": title, children: sectionGroups.map((group) => /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
10335
- group.label ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-2 px-1 text-[11px] font-semibold uppercase tracking-[0.18em] text-slate-500 dark:text-slate-500", children: group.label }) : null,
10336
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-1.5", children: group.sections.map((section) => {
10337
- const Icon = section.icon;
10338
- const isActive = activeSectionId === section.id;
10339
- return /* @__PURE__ */ jsxRuntime.jsxs(
10340
- "button",
10341
- {
10342
- type: "button",
10343
- onClick: () => onSectionChange(section.id),
10344
- className: [
10345
- "flex w-full items-center gap-3 rounded-2xl px-4 py-3 text-left text-sm font-medium transition-all duration-200",
10346
- isActive ? "liquid-surface liquid-surface-active text-slate-950 dark:text-white" : "text-slate-600 hover:bg-white/30 hover:text-slate-950 dark:text-slate-300 dark:hover:bg-white/[0.06] dark:hover:text-white"
10347
- ].join(" "),
10348
- children: [
10349
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "inline-flex h-10 w-10 items-center justify-center rounded-2xl bg-white/50 text-slate-600 shadow-sm backdrop-blur-sm dark:bg-white/[0.08] dark:text-slate-300", children: /* @__PURE__ */ jsxRuntime.jsx(Icon, { className: "h-5 w-5" }) }),
10350
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1", children: section.label }),
10351
- section.badge != null && section.badge > 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "inline-flex h-5 min-w-5 items-center justify-center rounded-full bg-indigo-100 px-1.5 text-[10px] font-bold text-indigo-700 dark:bg-indigo-500/20 dark:text-indigo-300", children: section.badge })
10352
- ]
10353
- },
10354
- section.id
10355
- );
10356
- }) })
10357
- ] }, group.label ?? group.sections.map((section) => section.id).join("-"))) }),
10358
- sidebarFooter ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-4 px-5", children: sidebarFooter }) : null
10359
- ] }),
10360
- /* @__PURE__ */ jsxRuntime.jsxs("section", { className: "relative flex min-h-0 flex-1 flex-col", children: [
10361
- gradient ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: `hidden lg:block h-1.5 w-full bg-gradient-to-r ${gradient}` }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-x-6 top-0 h-px bg-gradient-to-r from-transparent via-white/50 to-transparent dark:via-white/10" }),
10362
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: `flex min-h-0 flex-1 flex-col overflow-y-auto px-6 sm:px-8 lg:px-10 ${gradient ? "pt-8" : "pt-16"} ${footer ? "pb-4" : "pb-8 lg:pb-10"}`, children }),
10363
- footer ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-t border-white/20 px-6 py-4 dark:border-white/10 sm:px-8 lg:px-10", children: footer }) : null
10364
- ] }),
10365
- /* @__PURE__ */ jsxRuntime.jsx(
10366
- "button",
10367
- {
10368
- type: "button",
10369
- onClick: onClose,
10370
- "aria-label": closeLabel,
10371
- className: "absolute right-4 top-4 z-10 inline-flex h-9 w-9 items-center justify-center rounded-xl text-slate-400 transition hover:bg-white/40 hover:text-slate-700 dark:hover:bg-white/[0.08] dark:hover:text-white focus-visible:ring-2 focus-visible:ring-blue-500 focus-visible:ring-offset-2",
10372
- children: /* @__PURE__ */ jsxRuntime.jsx(HeroIcons.XMarkIcon, { className: "h-5 w-5" })
10373
- }
10374
- )
10375
- ] })
10376
- }
10377
- );
10378
- }
10379
- var SettingsDialog = GlassSidebarModal;
10380
- function GlassDetailModal({
10381
- open,
10382
- onClose,
10383
- gradient,
10384
- icon,
10385
- label,
10386
- title,
10387
- subtitle,
10388
- headerActions,
10389
- sections,
10390
- defaultSection,
10391
- maxWidth = "5xl",
10392
- footer
10393
- }) {
10394
- const [activeSection, setActiveSection] = React12.useState(
10395
- defaultSection ?? sections[0]?.id ?? ""
10396
- );
10397
- const activeContent = sections.find((s) => s.id === activeSection)?.content;
10398
- return /* @__PURE__ */ jsxRuntime.jsx(
10399
- GlassModalShell,
10400
- {
10401
- open,
10402
- onClose,
10403
- gradient,
10404
- icon,
10405
- label,
10406
- title,
10407
- subtitle,
10408
- headerActions,
10409
- maxWidth,
10410
- footer,
10411
- children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-h-[50vh]", children: [
10412
- /* @__PURE__ */ jsxRuntime.jsx("nav", { className: "w-48 shrink-0 border-r border-white/10 pr-4", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-0.5", children: sections.map((section) => {
10413
- const isActive = section.id === activeSection;
10414
- return /* @__PURE__ */ jsxRuntime.jsxs(
10415
- "button",
10416
- {
10417
- type: "button",
10418
- onClick: () => setActiveSection(section.id),
10419
- className: `
10420
- flex w-full items-center gap-2.5 rounded-lg px-3 py-2 text-left text-[13px]
10421
- transition-all duration-150
10422
- ${isActive ? "bg-white/10 text-white font-medium" : "text-slate-400 hover:bg-white/5 hover:text-slate-200"}
10423
- `,
10424
- children: [
10425
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: `shrink-0 ${isActive ? "text-blue-400" : "text-slate-500"}`, children: section.icon }),
10426
- /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1 truncate", children: section.label }),
10427
- section.badge
10428
- ]
10429
- },
10430
- section.id
10431
- );
10432
- }) }) }),
10433
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 overflow-y-auto pl-6", children: activeContent })
10434
- ] })
10435
- }
10436
- );
10437
- }
10438
10485
  function Fieldset2({
10439
10486
  className,
10440
10487
  ...props
@@ -10978,18 +11025,19 @@ function SettingsModal({
10978
11025
  signOut.label
10979
11026
  ] }) : sidebarFooter;
10980
11027
  return /* @__PURE__ */ jsxRuntime.jsx(
10981
- SettingsDialog,
11028
+ GlassModal,
10982
11029
  {
10983
11030
  open,
10984
11031
  onClose,
10985
11032
  title,
10986
11033
  subtitle,
10987
- sections: dialogSections,
10988
- activeSectionId,
10989
- onSectionChange: handleSectionChange,
10990
- closeLabel,
10991
- identity,
10992
- sidebarFooter: footer,
11034
+ sidebar: {
11035
+ sections: dialogSections,
11036
+ activeSectionId,
11037
+ onSectionChange: handleSectionChange,
11038
+ identity,
11039
+ footer
11040
+ },
10993
11041
  children: renderContent()
10994
11042
  }
10995
11043
  );
@@ -20296,11 +20344,7 @@ exports.GERMANY_STATE_COORDINATES = GERMANY_STATE_COORDINATES;
20296
20344
  exports.GERMANY_STATE_PALETTES = GERMANY_STATE_PALETTES;
20297
20345
  exports.GeoMapCanvas = GeoMapCanvas;
20298
20346
  exports.GeoMapLegend = GeoMapLegend;
20299
- exports.GlassDetailModal = GlassDetailModal;
20300
- exports.GlassFormModal = GlassFormModal;
20301
20347
  exports.GlassModal = GlassModal;
20302
- exports.GlassModalShell = GlassModalShell;
20303
- exports.GlassSidebarModal = GlassSidebarModal;
20304
20348
  exports.Gradient = Gradient;
20305
20349
  exports.GradientBackground = GradientBackground;
20306
20350
  exports.GrowthIndicator = GrowthIndicator;
@@ -20491,7 +20535,6 @@ exports.SelectableOptionsGrid = SelectableOptionsGrid;
20491
20535
  exports.SelectableTableRow = SelectableTableRow;
20492
20536
  exports.SelectionCard = SelectionCard;
20493
20537
  exports.ServerErrorPage = ServerErrorPage;
20494
- exports.SettingsDialog = SettingsDialog;
20495
20538
  exports.SettingsModal = SettingsModal;
20496
20539
  exports.Sheet = Sheet;
20497
20540
  exports.SkipToContent = SkipToContent;
@@ -20834,5 +20877,5 @@ exports.useGeoMapState = useGeoMapState;
20834
20877
  exports.useNotifications = useNotifications;
20835
20878
  exports.usePlatformShellStore = usePlatformShellStore;
20836
20879
  exports.usePullToRefresh = usePullToRefresh;
20837
- //# sourceMappingURL=chunk-DXY4VHMX.js.map
20838
- //# sourceMappingURL=chunk-DXY4VHMX.js.map
20880
+ //# sourceMappingURL=chunk-TLZ3SAQW.js.map
20881
+ //# sourceMappingURL=chunk-TLZ3SAQW.js.map