@waveinno/ui 0.3.0 → 0.5.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 +36 -0
- package/README.md +31 -13
- package/dist/components/brand/waveinno-logo.js +1 -1
- package/dist/components/charts/bar-list.js +1 -1
- package/dist/components/charts/heatmap.js +1 -1
- package/dist/components/patterns/activity-feed.js +1 -1
- package/dist/components/patterns/app-launcher.js +1 -1
- package/dist/components/patterns/data-table-edit.js +1 -1
- package/dist/components/patterns/data-table-filters.js +1 -1
- package/dist/components/patterns/data-table.js +1 -1
- package/dist/components/patterns/index.d.ts +1 -0
- package/dist/components/patterns/index.js +1 -1
- package/dist/components/patterns/org-chart.d.ts +48 -0
- package/dist/components/patterns/org-chart.js +1 -0
- package/dist/components/patterns/page-header.js +1 -1
- package/dist/components/patterns/page-hero.js +1 -1
- package/dist/components/patterns/stat-card.js +1 -1
- package/dist/components/patterns/timeline.js +1 -1
- package/dist/components/ui/accordion.d.ts +30 -0
- package/dist/components/ui/accordion.js +1 -0
- package/dist/components/ui/alert.js +1 -1
- package/dist/components/ui/avatar.js +1 -1
- package/dist/components/ui/badge.js +1 -1
- package/dist/components/ui/button.js +1 -1
- package/dist/components/ui/calendar.js +1 -1
- package/dist/components/ui/carousel.d.ts +27 -0
- package/dist/components/ui/carousel.js +1 -0
- package/dist/components/ui/checkbox.js +1 -1
- package/dist/components/ui/color-picker.d.ts +14 -0
- package/dist/components/ui/color-picker.js +1 -0
- package/dist/components/ui/combobox.js +1 -1
- package/dist/components/ui/confirm-dialog.d.ts +24 -11
- package/dist/components/ui/confirm-dialog.js +1 -1
- package/dist/components/ui/date-picker.d.ts +18 -1
- package/dist/components/ui/date-picker.js +1 -1
- package/dist/components/ui/dialog.js +1 -1
- package/dist/components/ui/dropdown-menu.js +1 -1
- package/dist/components/ui/file-upload.d.ts +12 -4
- package/dist/components/ui/file-upload.js +1 -1
- package/dist/components/ui/hover-card.d.ts +17 -0
- package/dist/components/ui/hover-card.js +1 -0
- package/dist/components/ui/index.d.ts +10 -0
- package/dist/components/ui/index.js +1 -1
- package/dist/components/ui/kbd.js +1 -1
- package/dist/components/ui/menu.d.ts +24 -0
- package/dist/components/ui/menu.js +1 -1
- package/dist/components/ui/pagination.d.ts +51 -0
- package/dist/components/ui/pagination.js +1 -0
- package/dist/components/ui/password-input.js +1 -1
- package/dist/components/ui/pin-input.js +1 -1
- package/dist/components/ui/popover.js +1 -1
- package/dist/components/ui/progress.js +1 -1
- package/dist/components/ui/radio-group.js +1 -1
- package/dist/components/ui/rating.d.ts +27 -0
- package/dist/components/ui/rating.js +1 -0
- package/dist/components/ui/scroll-area.d.ts +17 -0
- package/dist/components/ui/scroll-area.js +1 -0
- package/dist/components/ui/segmented.d.ts +1 -1
- package/dist/components/ui/segmented.js +1 -1
- package/dist/components/ui/sheet.js +1 -1
- package/dist/components/ui/slider.d.ts +18 -6
- package/dist/components/ui/slider.js +1 -1
- package/dist/components/ui/spinner.js +1 -1
- package/dist/components/ui/steps.d.ts +36 -0
- package/dist/components/ui/steps.js +1 -0
- package/dist/components/ui/tabs.js +1 -1
- package/dist/components/ui/tag-input.d.ts +33 -0
- package/dist/components/ui/tag-input.js +1 -0
- package/dist/components/ui/toast.js +1 -1
- package/dist/components/ui/tree-view.d.ts +38 -0
- package/dist/components/ui/tree-view.js +1 -0
- package/dist/hooks/index.d.ts +1 -0
- package/dist/hooks/index.js +1 -1
- package/dist/hooks/use-router.d.ts +41 -0
- package/dist/hooks/use-router.js +1 -0
- package/dist/lib/index.d.ts +1 -0
- package/dist/lib/index.js +1 -1
- package/dist/lib/theme.d.ts +48 -0
- package/dist/lib/theme.js +7 -0
- package/dist/next/index.d.ts +6 -0
- package/dist/next/index.js +1 -0
- package/dist/shell/app-shell.js +1 -1
- package/dist/shell/app-switcher.js +1 -1
- package/dist/shell/command-palette.js +1 -1
- package/dist/shell/icon-rail.js +1 -1
- package/dist/shell/mobile-nav.js +1 -1
- package/dist/shell/module-sidebar.js +1 -1
- package/dist/shell/notifications.js +1 -1
- package/dist/shell/placeholder-screen.js +1 -1
- package/dist/shell/topbar.js +1 -1
- package/dist/shell/use-active.js +1 -1
- package/dist/shell/user-menu.js +1 -1
- package/dist/styles.css +91 -5
- package/package.json +14 -1
package/CHANGELOG.md
CHANGED
|
@@ -6,6 +6,42 @@ prop, major = a renamed or removed export or prop.
|
|
|
6
6
|
|
|
7
7
|
## Unreleased
|
|
8
8
|
|
|
9
|
+
## 0.5.0 — 2026-10-02
|
|
10
|
+
|
|
11
|
+
- **New components**: Accordion (line, card, contained; chevron or plus), Pagination (outline, pill, gradient,
|
|
12
|
+
underline, dots, jumper, minimal; `pageRange()`), Steps (circle, glow, card, chevron, bar, dot; vertical), TreeView
|
|
13
|
+
(select, or tri-state checkboxes; full keyboard), HoverCard (default, glass, dark), ScrollArea (overlay scrollbar,
|
|
14
|
+
edge fades), TagInput (paste lists, validate, max, suggestions), Rating (half steps, labels, read-only with count),
|
|
15
|
+
Carousel (scroll-snap, arrows inside or outside, dots or bar, autoplay), ColorPicker and ColorPickerPopover,
|
|
16
|
+
OrgChart (card, gradient, avatar, compact, list; folding teams, pan, zoom, fit).
|
|
17
|
+
- **Menu** collapses: `collapsible`, `collapsed` / `onCollapsedChange`, `collapsedMode` `icons` (names in tooltips,
|
|
18
|
+
counts on the icons) or `hidden` (folds away, as the AppShell panel); `collapseShortcut` (⌘B); `MenuCollapseTrigger`.
|
|
19
|
+
- **DateRangePicker** redesigned: both ends and the length in the field, Start and End slots, presets showing their
|
|
20
|
+
dates, a band that previews the span, Cancel and Apply. **Behaviour change:** the value now changes on Apply; pass
|
|
21
|
+
`applyOnSelect` for the old commit-on-second-click. The calendar's range band is continuous along each week.
|
|
22
|
+
- **Slider** is smooth: the thumb follows the pointer and settles on the step; clicks and keys glide. New looks fat,
|
|
23
|
+
glow, stepped, minimal; vertical orientation.
|
|
24
|
+
- **FileUpload** looks: card, button, gallery (tiles with progress rings), avatar (`currentUrl`).
|
|
25
|
+
- **ConfirmDialog** looks: center, split, banner, sheet; `primary` tone; `hold` (press and hold to confirm).
|
|
26
|
+
- Docs: ⌘K search, a props table on every component page (read from the source), the new components' pages.
|
|
27
|
+
|
|
28
|
+
## 0.4.0 — 2026-10-02
|
|
29
|
+
|
|
30
|
+
- **Works in Vite and any React 19 app.** The package no longer imports Next.js: links and navigation go through a
|
|
31
|
+
router adapter (`RouterProvider`, `useRouterAdapter`, `RouterLink`). `next` is now an optional peer dependency.
|
|
32
|
+
- **`@waveinno/ui/next`**: `NextRouterProvider` (and `nextRouter`), the Next.js adapter.
|
|
33
|
+
**Action needed for Next.js apps using AppShell:** wrap the app in `<NextRouterProvider>`; without it the shell's
|
|
34
|
+
links still work, but as plain links with full page loads.
|
|
35
|
+
- **`createTheme()`**: a full light and dark palette from one brand colour (OKLCH), with radius and fonts; returns CSS
|
|
36
|
+
and token maps. `hexToOklch`, `oklchToHex`.
|
|
37
|
+
- **Theme tokens** `--brand-1`, `--brand-2` (the brand gradient) and `--ink` (dark panels); every gradient, glow and
|
|
38
|
+
ink surface now follows them. `--radius-scale` scales every component's corners, not just the three named radii.
|
|
39
|
+
Tailwind gets `bg-ink`, `from-brand-1`, `to-brand-2`.
|
|
40
|
+
- Toast: the icon sits centred in its tile (sonner's 16 px icon box is resized to fit); the tone washes in from the
|
|
41
|
+
icon's corner. StatCard: the gradient card's number is white again.
|
|
42
|
+
- Docs site in the repo (`npm run dev` → /docs): Next.js and Vite installation guides, typography and fonts, theming,
|
|
43
|
+
routing, a page per component with live preview and copy-paste code, and a live theme builder.
|
|
44
|
+
|
|
9
45
|
## 0.3.0 — 2026-10-02
|
|
10
46
|
|
|
11
47
|
- **RadioGroup**, **RadioGroupItem** and **RadioCard** (whole-card choices with icon, description and a price or badge).
|
package/README.md
CHANGED
|
@@ -7,27 +7,45 @@ the brand, in light and dark, in English and Bangla. Shipped as compiled JavaScr
|
|
|
7
7
|
npm install @waveinno/ui
|
|
8
8
|
```
|
|
9
9
|
|
|
10
|
-
## Set up
|
|
10
|
+
## Set up
|
|
11
|
+
|
|
12
|
+
Full guides, with every file: run the docs (`npm run dev`, then http://localhost:4500/docs) and open **Installation →
|
|
13
|
+
Next.js** or **Vite**. In short:
|
|
11
14
|
|
|
12
15
|
```css
|
|
13
|
-
/*
|
|
16
|
+
/* globals.css (Next.js) or src/index.css (Vite) */
|
|
14
17
|
@import "tailwindcss";
|
|
15
18
|
@import "@waveinno/ui/styles.css";
|
|
16
|
-
/* Tailwind must see the class names the package uses. */
|
|
17
|
-
@source "
|
|
19
|
+
/* Tailwind must see the class names the package uses (path relative to this file). */
|
|
20
|
+
@source "../node_modules/@waveinno/ui/dist";
|
|
18
21
|
```
|
|
19
22
|
|
|
20
23
|
```tsx
|
|
21
|
-
// app/layout.tsx — apply the saved theme before first paint (no flash)
|
|
24
|
+
// Next.js: app/layout.tsx — apply the saved theme before first paint (no flash)
|
|
22
25
|
import { themeBootScript } from "@waveinno/ui";
|
|
23
|
-
|
|
24
26
|
<head>
|
|
25
|
-
<script dangerouslySetInnerHTML={{ __html: themeBootScript(
|
|
27
|
+
<script dangerouslySetInnerHTML={{ __html: themeBootScript() }} />
|
|
26
28
|
</head>;
|
|
29
|
+
|
|
30
|
+
// app/providers.tsx ("use client") — Next.js links for the shell, tooltips, toasts
|
|
31
|
+
import { Toaster, TooltipProvider } from "@waveinno/ui";
|
|
32
|
+
import { NextRouterProvider } from "@waveinno/ui/next";
|
|
33
|
+
<NextRouterProvider>
|
|
34
|
+
<TooltipProvider>{children}<Toaster /></TooltipProvider>
|
|
35
|
+
</NextRouterProvider>;
|
|
27
36
|
```
|
|
28
37
|
|
|
29
|
-
Peer dependencies: `react` and `react-dom` 19+,
|
|
30
|
-
|
|
38
|
+
Vite needs no Next.js: the main entry never imports it. Peer dependencies: `react` and `react-dom` 19+,
|
|
39
|
+
`tailwindcss` 4+, and `next` 16+ only for `@waveinno/ui/next`. Fonts: Inter, Plus Jakarta Sans, JetBrains Mono, and
|
|
40
|
+
Noto Sans Bengali after each (Inter has no Bangla and no ৳).
|
|
41
|
+
|
|
42
|
+
## Theme
|
|
43
|
+
|
|
44
|
+
```ts
|
|
45
|
+
import { createTheme } from "@waveinno/ui";
|
|
46
|
+
const { css } = createTheme({ primary: "#0f9d7a", radius: "lg", fontSans: "Manrope" });
|
|
47
|
+
// paste css after the package's stylesheet; or try colours live in the docs' theme builder (/themes)
|
|
48
|
+
```
|
|
31
49
|
|
|
32
50
|
## Use
|
|
33
51
|
|
|
@@ -45,17 +63,17 @@ through `labels` props, so each product passes its own language.
|
|
|
45
63
|
|
|
46
64
|
| Group | Components |
|
|
47
65
|
| --- | --- |
|
|
48
|
-
| Primitives | Button (working + showcase variants), Badge (soft, solid, outline, dot, gradient, live), Input / Textarea (states, adornments), NumberInput, PasswordInput (strength, Caps Lock), PinInput (OTP), FileUpload, FormField, Select, Combobox (searchable), Checkbox, RadioGroup and RadioCard, Switch, Slider (range, marks), Segmented, Tabs (underline, pill, solid, enclosed), Calendar, DatePicker, DateTimePicker, DateRangePicker, TimePicker, Dialog (drawer that widens or goes full width), Sheet, ConfirmDialog, DropdownMenu (rich items, header, dark), Menu (soft, line, raised, gradient, dark, plus the shell's panel and rail; branches, sliding highlight), Popover (arrow, dark, brand), Tooltip, Alert (five tones, four looks), Toaster and toast, Spinner (ring, dots, wave), Kbd, Progress / ProgressRing, Avatar, Skeleton |
|
|
49
|
-
| Patterns | AppLauncher (switch-app button: grid, list, spotlight, glass, dark), DataTable (advanced filters, saved views, five looks, inline and bulk edit, bulk delete, sticky actions), UserCell, RowActions, PageHero, PageHeader, StatCard, KpiCard, Money, ActivityFeed, ActivityTimeline, ChangeHistory, ChangeNotes, Note, Kanban, empty / error / loading states |
|
|
66
|
+
| Primitives | Button (working + showcase variants), Badge (soft, solid, outline, dot, gradient, live), Input / Textarea (states, adornments), NumberInput, PasswordInput (strength, Caps Lock), PinInput (OTP), FileUpload, FormField, Select, Combobox (searchable), Checkbox, RadioGroup and RadioCard, Switch, Slider (range, marks), Segmented, Tabs (underline, pill, solid, enclosed), Calendar, DatePicker, DateTimePicker, DateRangePicker, TimePicker, Dialog (drawer that widens or goes full width), Sheet, ConfirmDialog, DropdownMenu (rich items, header, dark), Menu (soft, line, raised, gradient, dark, plus the shell's panel and rail; branches, sliding highlight), Popover (arrow, dark, brand), HoverCard, Tooltip, Alert (five tones, four looks), Toaster and toast, Spinner (ring, dots, wave), Kbd, Accordion, Pagination (seven looks), Steps (six looks), TreeView, ScrollArea, TagInput, Rating, Carousel, ColorPicker, Progress / ProgressRing, Avatar, Skeleton |
|
|
67
|
+
| Patterns | AppLauncher (switch-app button: grid, list, spotlight, glass, dark), OrgChart (card, gradient, avatar, compact, list), DataTable (advanced filters, saved views, five looks, inline and bulk edit, bulk delete, sticky actions), UserCell, RowActions, PageHero, PageHeader, StatCard, KpiCard, Money, ActivityFeed, ActivityTimeline, ChangeHistory, ChangeNotes, Note, Kanban, empty / error / loading states |
|
|
50
68
|
| Charts | TrendChart, BarChart, LineChart, DonutChart, GaugeChart, Heatmap, BarList, ChartCard, validated palette |
|
|
51
69
|
| Brand | WaveinnoLogo, WaveinnoSymbol, WaveMark (app icon: seven tones, round, 3D, animated), PoweredBy, Watermark; `@waveinno/ui/brand/waveinno-logo.svg` |
|
|
52
70
|
| Shell | AppShell (rail → panel → content → drawer, ⌘K), theme and density controls, record drawer |
|
|
53
71
|
|
|
54
|
-
##
|
|
72
|
+
## Docs and playground
|
|
55
73
|
|
|
56
74
|
```bash
|
|
57
75
|
npm install
|
|
58
|
-
npm run dev #
|
|
76
|
+
npm run dev # http://localhost:4500 — docs (/docs), theme builder (/themes), every component on one page (/playground), live from src/
|
|
59
77
|
```
|
|
60
78
|
|
|
61
79
|
Adding or changing a component: see [CONTRIBUTING.md](CONTRIBUTING.md).
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as e,jsxs as n}from"react/jsx-runtime";import*as c from"react";import{cn as
|
|
1
|
+
import{jsx as e,jsxs as n}from"react/jsx-runtime";import*as c from"react";import{cn as l}from"../../lib/utils.js";const u=["M1813.61,996.15a83,83,0,0,1,18.61-27.62A89.37,89.37,0,0,1,1861,950.21c11.11-4.5,23.12-6.6,36.33-6.6s25.22,2.1,36.33,6.6a83.21,83.21,0,0,1,47.14,45.94,90.43,90.43,0,0,1,6.6,35.13c0,12.91-2.1,24.62-6.6,35.42a86,86,0,0,1-18.62,27.93,87.76,87.76,0,0,1-28.52,18.31c-11.11,4.5-23.12,6.6-36.33,6.6s-25.22-2.1-36.33-6.6a89.35,89.35,0,0,1-28.82-18.31,81.45,81.45,0,0,1-18.61-27.93,93.49,93.49,0,0,1,0-70.55Zm40.53,54.94a46.08,46.08,0,0,0,43.23,30,43.2,43.2,0,0,0,18.62-3.91A41.77,41.77,0,0,0,1930.7,1067a52.44,52.44,0,0,0,9.61-15.91,61.14,61.14,0,0,0,0-39.63,54.86,54.86,0,0,0-9.61-15.61A47.06,47.06,0,0,0,1916,985.34a47.9,47.9,0,0,0-18.62-3.6,46.79,46.79,0,0,0-18.61,3.6,48.25,48.25,0,0,0-15,10.51,43.84,43.84,0,0,0-9.61,15.61,56.33,56.33,0,0,0,0,39.63Z","M722.47,1061.5a74.57,74.57,0,0,1-16.65,25.57,73.37,73.37,0,0,1-25.27,16.65,86.77,86.77,0,0,1-32.11,6q-21,0-37.46-8.92a71.35,71.35,0,0,1-26.46-24.09,73.73,73.73,0,0,1-26.46,24.09q-16.5,8.91-37.46,8.92a85.28,85.28,0,0,1-31.82-6,73.83,73.83,0,0,1-42.21-42.22,86.77,86.77,0,0,1-5.95-32.11v-91h43.11v89.79c0,13.08,3.87,23.49,11.3,31.52s17.24,11.89,28.84,11.89a42.25,42.25,0,0,0,16.35-3.27,37.82,37.82,0,0,0,12.49-9.22,42.23,42.23,0,0,0,8.32-13.67,45.72,45.72,0,0,0,3-17.25V938.41h41v89.79a46.8,46.8,0,0,0,3,17.25,42.05,42.05,0,0,0,8.32,13.67,36.1,36.1,0,0,0,12.79,9.22,41.85,41.85,0,0,0,16,3.27c11.89,0,21.71-3.87,29.14-11.89s11-18.44,11-31.52V938.41h43.11v91A86.77,86.77,0,0,1,722.47,1061.5Z","M759,988.36a84.63,84.63,0,0,1,18.43-28A83.17,83.17,0,0,1,805.71,942c10.71-4.46,22.6-6.54,35.38-6.54a98.64,98.64,0,0,1,34.49,5.95,82.52,82.52,0,0,1,27.06,17.24,79.35,79.35,0,0,1,17.54,26.16,85.9,85.9,0,0,1,6.24,33v88.89H885.1v-25.27c-4.46,8.62-11.9,15.46-21.71,20.52a75.91,75.91,0,0,1-64.22,1.18,70,70,0,0,1-24.67-17.83,81.81,81.81,0,0,1-16.06-27.06,98.91,98.91,0,0,1-6-34.49C752.49,1011,754.58,999.07,759,988.36Zm40.13,53.82a42,42,0,0,0,9.22,15.46,38,38,0,0,0,13.68,10.1,38.78,38.78,0,0,0,17.54,3.87,43.46,43.46,0,0,0,17.84-3.57,39.31,39.31,0,0,0,14-10.11,46.86,46.86,0,0,0,8.92-15.46,59.7,59.7,0,0,0,3-19.92,62.27,62.27,0,0,0-3.27-19.92,46.79,46.79,0,0,0-8.92-15.46,43.91,43.91,0,0,0-14-10.4,41.19,41.19,0,0,0-48.76,10.4,47.47,47.47,0,0,0-9.22,15.46,62.27,62.27,0,0,0-3.27,19.92A59.11,59.11,0,0,0,799.17,1042.18Z","M1005.81,1106.69l-69-168.57h44.89l51.44,135.57,66.12-179.37h45.49l-84,212.37Z","M1292.41,1074.29a75.91,75.91,0,0,1-19,18.73,81.4,81.4,0,0,1-25,12.19,94.91,94.91,0,0,1-29.14,4.46c-12.48,0-24.08-2.08-34.49-6.55a84.32,84.32,0,0,1-27.65-18.13,79.12,79.12,0,0,1-17.83-27.65c-4.46-10.71-6.55-22.3-6.55-35.08a89.47,89.47,0,0,1,6.55-34.79,86.11,86.11,0,0,1,18.13-27.35c7.43-7.73,16.65-13.68,27.35-18.14,10.41-4.46,22-6.54,34.49-6.54a96.51,96.51,0,0,1,36.57,6.84,80.21,80.21,0,0,1,27.65,19.92A95.31,95.31,0,0,1,1301,992.52a114.42,114.42,0,0,1,6.25,38.66H1176.46c1.49,13.08,6.54,23.48,14.57,31.51s17.84,11.89,29.73,11.89a51,51,0,0,0,25.87-6.84,38.71,38.71,0,0,0,16-17.83H1304A73.86,73.86,0,0,1,1292.41,1074.29Zm-42.81-94.55c-8-6.84-17.54-10.11-28.84-10.11S1200,973.2,1192.22,980s-12.79,16.05-14.87,27.65h87.41C1262.68,995.79,1257.63,986.58,1249.6,979.74Z","M1337.9,874.49a23,23,0,0,1,32.11,0,21.1,21.1,0,0,1,6.54,15.76,21.75,21.75,0,0,1-6.54,16,22.26,22.26,0,0,1-32.11,0,21.76,21.76,0,0,1-6.55-16A21.11,21.11,0,0,1,1337.9,874.49Zm37.16,232.2h-42.22V938.41h42.22Z","M1533.82,1016.9c0-13.08-3.86-23.48-11.59-31.51-8-8-18.14-11.89-30.33-11.89-12.49,0-22.6,3.86-30.33,11.89-8,8-11.89,18.43-11.89,31.51v89.79h-43.11v-91.27a78,78,0,0,1,6.54-32.41,75.62,75.62,0,0,1,17.54-25.27,82.26,82.26,0,0,1,27.06-16.35,96.94,96.94,0,0,1,34.19-5.95,98.17,98.17,0,0,1,34.19,5.95,76.94,76.94,0,0,1,44.6,41.62,82.88,82.88,0,0,1,6.24,32.41v91.27h-43.11Z","M1777.9,1015.42v91.27h-43.11V1016.9c0-13.08-3.86-23.48-11.59-31.52-8-8-18.13-11.89-30.33-11.89-12.49,0-22.6,3.87-30.32,11.89-8,8-11.89,18.44-11.89,31.52v89.79h-43.11v-91.27a78,78,0,0,1,6.53-32.41,75.8,75.8,0,0,1,17.55-25.27,82.36,82.36,0,0,1,27-16.36,97.21,97.21,0,0,1,34.19-5.94,102.42,102.42,0,0,1,11.44.62,96.48,96.48,0,0,1,22.76,5.32,76,76,0,0,1,50.79,71.3C1777.89,1013.59,1777.9,1014.5,1777.9,1015.42Z"],v="M1728.11,921.1h.22c19-.47,37.93-.7,56.9-1.21a26.67,26.67,0,0,1,3.49.36c.2,2.21.46,4.13.52,6,.47,17.92,1,35.81,1.47,53.72v.19c-.52-1.3-1.08-2.57-1.66-3.83-.16-.39-.35-.77-.52-1.15-.36-.76-.72-1.52-1.1-2.27-.18-.38-.38-.74-.58-1.11s-.29-.6-.45-.89a101,101,0,0,0-6.29-10.39l-.74-1.07a103.42,103.42,0,0,0-6.95-8.78l-.82-.92c-.3-.34-.62-.69-.94-1s-.62-.67-1-1-.62-.67-.94-1l-1-1-2-1.92-1-.94-1-.92-1-.92-1-.89-1.28-1.07c-.63-.52-1.28-1-1.93-1.55-.37-.28-.73-.57-1.1-.84s-.79-.61-1.2-.91-.68-.5-1-.73l-1.32-.94-.95-.65c-1.14-.78-2.29-1.54-3.47-2.26-.39-.25-.78-.5-1.18-.73a102,102,0,0,0-10.12-5.39c-1-.46-2-.9-3-1.31-.49-.21-1-.42-1.46-.61s-.77-.33-1.16-.47l-1.18-.46C1730.28,921.87,1729.2,921.48,1728.11,921.1Z",d="M125,1019.41l-8.72,9.16c-4.84-5.51-11.54-10.91-18.68-11.59-4.45-.44-9.17,0-13.64,0H49.73a13.45,13.45,0,0,1-13.45-13.45v-50.7a13.45,13.45,0,0,1,13.45-13.45H99.28a13.46,13.46,0,0,1,13.46,13.45v24.5c0,10.29-2.71,22.17,3,31.5A42.32,42.32,0,0,0,125,1019.41Z",p="M401.1,938.26v81.47l-33.28.5a22.1,22.1,0,0,0-16.2,7.43l-66.45,74.6a22.09,22.09,0,0,1-16.51,7.41H247.59a11.38,11.38,0,0,1-11.37-11.38v-78.56h-8.54a24.74,24.74,0,0,0-18.37,8.18l-2.48,2.77-5.62,6.26-57.38,63.85a26.17,26.17,0,0,1-4.58,4,26.77,26.77,0,0,1-11,4.47,27.48,27.48,0,0,1-4.36.36H110.87a16.06,16.06,0,0,1-16.06-16.08v-42.43l21.49-22.59,8.72-9.16,64.68-68A37,37,0,0,1,216.47,940H248v85l.09-.09.07,21,89.94-96.13a37,37,0,0,1,26.77-11.48Z";function f({id:a}){return n("defs",{children:[n("linearGradient",{id:`${a}-a`,x1:"80.65",y1:"939.38",x2:"80.65",y2:"1028.57",gradientUnits:"userSpaceOnUse",children:[e("stop",{offset:"0",stopColor:"#1437d3"}),e("stop",{offset:"1",stopColor:"#7560fd"})]}),n("linearGradient",{id:`${a}-b`,x1:"247.96",y1:"938.26",x2:"247.96",y2:"1109.67",gradientUnits:"userSpaceOnUse",children:[e("stop",{offset:"0",stopColor:"#1437d3"}),e("stop",{offset:"1",stopColor:"#7560fd"})]}),n("linearGradient",{id:`${a}-c`,x1:"1728.11",y1:"950.03",x2:"1790.71",y2:"950.03",gradientUnits:"userSpaceOnUse",children:[e("stop",{offset:"0",stopColor:"#1437d3"}),e("stop",{offset:"1",stopColor:"#7560fd"})]})]})}function h({className:a,tone:o="default",title:r="WAVEINNO"}){const t=c.useId().replace(/:/g,"");return n("svg",{viewBox:"-8 -8 1967.16 267.6",overflow:"visible",className:l("h-6 w-auto shrink-0",o==="inverse"?"text-white":"text-text",a),role:r?"img":void 0,"aria-label":r||void 0,"aria-hidden":r?void 0:!0,children:[e(f,{id:t}),n("g",{transform:"translate(-36.28 -867.95)",children:[u.map(s=>e("path",{d:s,fill:"currentColor"},s.slice(0,24))),e("path",{d:v,fill:`url(#${t}-c)`}),e("path",{d,fill:`url(#${t}-a)`}),e("path",{d:p,fill:`url(#${t}-b)`})]})]})}function g({className:a,style:o,title:r="WAVEINNO",mono:t=!1}){const s=c.useId().replace(/:/g,"");return n("svg",{viewBox:"36.28 938.26 364.82 171.41",className:l("h-6 w-auto shrink-0",a),style:o,role:r?"img":void 0,"aria-label":r||void 0,"aria-hidden":r?void 0:!0,children:[t?null:e(f,{id:s}),e("path",{d,fill:t?"currentColor":`url(#${s}-a)`}),e("path",{d:p,fill:t?"currentColor":`url(#${s}-b)`})]})}const x={"bottom-left":"bottom-2.5 left-2.5","bottom-right":"bottom-2.5 right-2.5","top-left":"top-2.5 left-2.5","top-right":"top-2.5 right-2.5"};function N({product:a,icon:o,variant:r="inline",position:t="bottom-left",label:s="powered by",className:m}){const i=n("span",{className:l("flex items-center gap-1 font-medium text-muted",a?"mt-0.5 text-[9px]":"text-[11px]"),children:[s,e(h,{title:"",className:a?"h-[9px]":"h-[11px]"})]});return n("div",{"aria-label":a?`${a}, ${s} WAVEINNO`:`${s} WAVEINNO`,role:"img",className:l("flex select-none items-center gap-1.5",r==="floating"&&l("pointer-events-none absolute z-10 rounded-[calc(11px*var(--radius-scale))] border border-border bg-canvas/75 py-[5px] pl-1.5 pr-2.5 shadow-[0_4px_14px_-6px_rgba(10,15,46,.35)] backdrop-blur-md",x[t]),m),children:[o?e("span",{className:"grid shrink-0 place-items-center",children:o}):null,a?n("span",{className:"flex flex-col leading-none",children:[e("b",{className:"text-[12.5px] font-extrabold tracking-[0.14em] text-text",children:a.toUpperCase()}),i]}):i]})}function y({opacity:a=.05,className:o}){return e("div",{"aria-hidden":!0,className:l("pointer-events-none absolute inset-0 grid select-none place-items-center overflow-hidden",o),children:e("div",{style:{opacity:a},className:"w-[55%] max-w-[420px] -rotate-12",children:e(g,{title:"",className:"h-auto w-full"})})})}export{N as PoweredBy,y as Watermark,h as WaveinnoLogo,g as WaveinnoSymbol};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as
|
|
1
|
+
import{jsx as a,jsxs as r}from"react/jsx-runtime";import{cn as l}from"../../lib/utils.js";function v({items:n,format:o=t=>t.toLocaleString(),sort:i=!0,color:c="var(--primary-subtle)",className:u}){const t=i?[...n].sort((e,s)=>s.value-e.value):n,m=Math.max(1,...t.map(e=>e.value));return a("ul",{className:l("space-y-1.5",u),children:t.map(e=>{const s=e.href?"a":"div";return a("li",{children:r(s,{...e.href?{href:e.href}:{},className:l("group flex items-center gap-3",e.href&&"cursor-pointer"),children:[r("div",{className:"relative h-8 min-w-0 flex-1 overflow-hidden rounded-[calc(7px*var(--radius-scale))]",children:[a("div",{className:"absolute inset-y-0 left-0 rounded-[calc(7px*var(--radius-scale))] transition-[width] duration-700 ease-[var(--ease)] group-hover:brightness-95",style:{width:`${Math.max(2,e.value/m*100)}%`,background:c}}),r("div",{className:"relative flex h-full items-center gap-2 px-2.5 text-[13px]",children:[e.icon?a("span",{className:"shrink-0 text-muted [&>svg]:size-4",children:e.icon}):null,a("span",{className:"truncate font-medium text-text",children:e.label}),e.hint?a("span",{className:"truncate text-[12px] text-muted",children:e.hint}):null]})]}),a("span",{className:"num w-20 shrink-0 text-right text-[13px] font-medium text-text",children:o(e.value)})]})},e.id)})})}export{v as BarList};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as
|
|
1
|
+
import{jsx as e,jsxs as r}from"react/jsx-runtime";import*as v from"react";import{cn as f}from"../../lib/utils.js";import{SEQUENTIAL as s}from"./palette.js";function b({rows:u,columns:m,values:o,format:t=n=>String(n),max:x,showColumnEvery:d=1,className:g}){const n=x??Math.max(1,...o.flat()),c=a=>a<=0?"var(--hover)":s[Math.min(s.length-1,Math.floor(a/n*(s.length-.001)))];return r("div",{className:f("overflow-x-auto",g),children:[r("div",{className:"inline-grid min-w-full gap-[3px]",style:{gridTemplateColumns:`auto repeat(${m.length}, minmax(14px, 1fr))`},children:[e("span",{}),m.map((a,p)=>e("span",{className:"num pb-1 text-center text-[10.5px] text-muted",children:p%d===0?a:""},a)),u.map((a,p)=>r(v.Fragment,{children:[e("span",{className:"pr-2 text-right text-[11.5px] leading-[18px] text-muted",children:a}),m.map((i,h)=>{const l=o[p]?.[h]??0;return e("span",{title:`${a} \xB7 ${i}: ${t(l)}`,"aria-label":`${a} ${i}: ${t(l)}`,className:"h-[18px] rounded-[calc(4px*var(--radius-scale))] transition-transform hover:scale-110 hover:ring-2 hover:ring-primary/40",style:{background:c(l)}},i)})]},a))]}),r("div",{className:"mt-3 flex items-center justify-end gap-2 text-[11px] text-muted",children:[e("span",{className:"num",children:t(0)}),e("span",{className:"flex gap-[3px]",children:s.map(a=>e("span",{className:"h-2.5 w-5 rounded-[3px]",style:{background:a}},a))}),e("span",{className:"num",children:t(n)})]})]})}export{b as Heatmap};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as
|
|
1
|
+
import{jsx as a,jsxs as t}from"react/jsx-runtime";import{cn as s}from"../../lib/utils.js";import{Badge as c}from"../ui/badge.js";const i={neutral:"bg-hover text-muted",info:"bg-primary-subtle text-primary",success:"bg-success-subtle text-success",warning:"bg-warning-subtle text-warning",danger:"bg-danger-subtle text-danger",accent:"bg-primary-subtle text-accent"},o={neutral:"before:bg-border2",info:"before:bg-primary",success:"before:bg-success",warning:"before:bg-warning",danger:"before:bg-danger",accent:"before:bg-accent"};function x({items:n,variant:l="list",className:r}){return l==="cards"?a("ul",{className:s("space-y-2",r),children:n.map(e=>t("li",{className:s("relative flex items-center gap-3 overflow-hidden rounded-[calc(12px*var(--radius-scale))] border border-border bg-raised py-3 pl-4 pr-3 shadow-[var(--lit)] transition-[transform,box-shadow] hover:-translate-y-px hover:shadow-[var(--lit),0_8px_20px_-12px_rgba(5,8,22,.3)]","before:absolute before:inset-y-0 before:left-0 before:w-[3px]",o[e.tone]),children:[a("span",{className:s("grid size-9 shrink-0 place-items-center rounded-[calc(10px*var(--radius-scale))] [&_svg]:size-[18px]",i[e.tone]),children:e.icon??a("i",{className:"size-2 rounded-full bg-current"})}),t("div",{className:"min-w-0 flex-1",children:[t("div",{className:"flex items-center gap-2",children:[a("p",{className:"truncate text-[13px] font-semibold text-text",children:e.title}),e.time?a("span",{className:"ml-auto shrink-0 text-[11px] text-muted",children:e.time}):null]}),a("p",{className:"mt-0.5 text-[12px] text-muted",children:e.detail})]}),e.action?a("div",{className:"shrink-0",children:e.action}):null]},e.id))}):l==="compact"?a("ul",{className:s("divide-y divide-border",r),children:n.map(e=>t("li",{className:"flex items-center gap-2.5 py-2 text-[12.5px]",children:[a(c,{tone:e.tone,className:"h-4 shrink-0 px-1",children:a("span",{className:"sr-only",children:e.tone})}),t("span",{className:"min-w-0 flex-1 truncate",children:[a("span",{className:"font-medium text-text",children:e.title})," ",t("span",{className:"text-muted",children:["\xB7 ",e.detail]})]}),e.time?a("span",{className:"shrink-0 text-[11px] text-muted",children:e.time}):null,e.action?a("div",{className:"shrink-0",children:e.action}):null]},e.id))}):a("ul",{className:s("",r),children:n.map(e=>t("li",{className:"flex items-center gap-3 border-b border-border py-3 last:border-0",children:[a(c,{tone:e.tone,className:"h-[18px] shrink-0 px-1.5",children:a("span",{className:"sr-only",children:e.tone})}),t("div",{className:"min-w-0 flex-1",children:[a("p",{className:"text-[13px] font-medium leading-[18px] text-text",children:e.title}),a("p",{className:"mt-0.5 text-xs text-muted",children:e.detail})]}),e.action?a("div",{className:"shrink-0",children:e.action}):null]},e.id))})}export{x as ActivityFeed};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{Fragment as _,jsx as e,jsxs as
|
|
1
|
+
"use client";import{Fragment as _,jsx as e,jsxs as i}from"react/jsx-runtime";import*as b from"@radix-ui/react-popover";import{ArrowUpRight as M,Check as w}from"lucide-react";import*as N from"react";import{cn as c}from"../../lib/utils.js";const G={grid:"w-[328px] border-border bg-raised",list:"w-[340px] border-border bg-raised",spotlight:"w-[560px] max-w-[calc(100vw-24px)] border-border bg-raised p-0",glass:"w-[328px] border-white/50 bg-raised/65 backdrop-blur-2xl backdrop-saturate-150 shadow-[inset_0_1px_0_rgba(255,255,255,.6),var(--elev3)] dark:border-white/10 dark:shadow-[inset_0_1px_0_rgba(255,255,255,.08),var(--elev3)]",dark:"w-[328px] border-white/10 text-white bg-[var(--ink)] bg-[image:radial-gradient(120%_60%_at_0%_0%,color-mix(in_srgb,var(--brand-2)_32%,transparent),transparent_60%)] [--text:#f5f6fa] [--body:#c9cce0] [--muted:#8d93b3] [--border:rgba(255,255,255,.1)] [--hover:rgba(255,255,255,.07)] [--primary:#a5a8ff] [--primary-subtle:rgba(139,143,248,.16)] [--raised:rgba(255,255,255,.06)] [--surface:rgba(255,255,255,.04)]"},U={icon:"size-9 rounded-full text-muted hover:bg-hover hover:text-text data-[state=open]:bg-hover data-[state=open]:text-text",chip:"h-9 gap-2 rounded-full border border-border bg-raised pl-1.5 pr-3 text-[13px] font-medium text-text shadow-[var(--lit),0_1px_2px_rgba(5,8,22,.06)] hover:bg-hover data-[state=open]:bg-hover"};function T({open:a}){return e("svg",{viewBox:"0 0 18 18",className:"size-[18px] shrink-0","aria-hidden":!0,children:Array.from({length:9},(n,s)=>{const r=Math.floor(s/3),o=s%3,p=r===o||r+o===2,g=a&&p?(1-o)*1.6:0,u=a&&p?(1-r)*1.6:0;return e("circle",{cx:3+o*6,cy:3+r*6,r:1.7,fill:"currentColor",style:{transform:`translate(${g}px, ${u}px) scale(${a&&!p?0:1})`,transformOrigin:`${3+o*6}px ${3+r*6}px`,transition:`transform 260ms cubic-bezier(.3,.7,.2,1) ${a?s*12:(8-s)*12}ms`}},s)})})}function x({app:a,size:n,glow:s}){const r={sm:"size-8 rounded-[calc(9px*var(--radius-scale))] [&_svg]:size-4",md:"size-12 rounded-[calc(14px*var(--radius-scale))] [&_svg]:size-[22px]",lg:"size-14 rounded-[calc(16px*var(--radius-scale))] [&_svg]:size-6"}[n];return a.tint?e("span",{className:c("relative isolate grid shrink-0 place-items-center overflow-hidden text-white","before:absolute before:inset-x-0 before:top-0 before:-z-10 before:h-1/2 before:bg-[linear-gradient(180deg,rgba(255,255,255,.28),transparent)]",r),style:{background:a.tint,boxShadow:`inset 0 1px 0 rgba(255,255,255,.35), inset 0 -8px 16px -8px rgba(5,8,22,.3), 0 1px 2px rgba(5,8,22,.18)${s?", 0 10px 24px -10px color-mix(in srgb, var(--brand-2) 70%, transparent)":""}`},children:a.icon}):e("span",{className:c("grid shrink-0 place-items-center [&>img]:size-full [&>*]:max-h-full [&>*]:max-w-full",r),children:a.icon})}function j(a){return n=>{const s=Array.from(n.currentTarget.querySelectorAll("[data-launcher-app]:not([aria-disabled='true'])")),r=s.indexOf(document.activeElement);if(r<0)return;const o={ArrowRight:1,ArrowLeft:-1,ArrowDown:a,ArrowUp:-a}[n.key];let p;o!==void 0?p=s[Math.min(Math.max(r+o,0),s.length-1)]:n.key==="Home"?p=s[0]:n.key==="End"&&(p=s[s.length-1]),p&&(n.preventDefault(),p.focus())}}function y({app:a,current:n,onChoose:s,className:r,children:o,onFocus:p,onMouseEnter:g}){const u={"data-launcher-app":"","aria-current":n?"page":void 0,"aria-disabled":a.disabled||void 0,className:c("outline-none focus-visible:ring-2 focus-visible:ring-primary/45",a.disabled&&"pointer-events-none opacity-45",r),onFocus:p,onMouseEnter:g};return a.href&&!a.disabled?e("a",{href:a.href,...u,onClick:()=>s(a),children:o}):e("button",{type:"button",disabled:a.disabled,...u,onClick:()=>s(a),children:o})}function W({apps:a,current:n,onSelect:s,variant:r="grid",trigger:o="icon",title:p="Apps",action:g,footer:u,align:C="end",side:O="bottom",open:k,onOpenChange:S,className:D}){const[H,$]=N.useState(!1),h=k??H,A=t=>{k===void 0&&$(t),S?.(t)},m=a.find(t=>t.id===n),[K,L]=N.useState(n),l=a.find(t=>t.id===K)??m??a[0],z=r==="grid"||r==="glass"||r==="dark",R=j(z?3:1),f=N.useRef(null),v=t=>{s?.(t),A(!1)},P=i("div",{className:c("flex items-center justify-between gap-2",r==="spotlight"?"border-b border-border px-4 py-3":"px-1 pb-2.5"),children:[e("p",{className:"text-[13px] font-semibold text-text",children:p}),g]}),q=e("div",{ref:f,role:"list",onKeyDown:R,className:"grid grid-cols-3 gap-1",children:a.map(t=>{const d=t.id===n;return e("div",{role:"listitem",children:i(y,{app:t,current:d,onChoose:v,className:c("group/app relative flex w-full cursor-pointer flex-col items-center gap-2 rounded-[calc(12px*var(--radius-scale))] px-1 pb-2.5 pt-3 text-center transition-colors duration-150",r==="glass"?"hover:bg-white/40 focus-visible:bg-white/40 dark:hover:bg-white/10 dark:focus-visible:bg-white/10":"hover:bg-hover focus-visible:bg-hover",d&&(r==="dark"?"bg-white/[.06]":r==="glass"?"bg-white/30 dark:bg-white/[.06]":"bg-primary-subtle/60")),children:[i("span",{className:"relative transition-transform duration-200 ease-[cubic-bezier(.3,.7,.2,1)] group-hover/app:-translate-y-0.5 group-hover/app:scale-[1.04]",children:[e(x,{app:t,size:"md",glow:r==="dark"}),d?e("span",{className:"absolute -bottom-1 -right-1 grid size-4 place-items-center rounded-full bg-primary text-white ring-2 ring-[var(--raised)] [&_svg]:size-2.5",children:e(w,{strokeWidth:3.5})}):null]}),e("span",{className:"w-full truncate text-[12px] font-medium leading-4 text-text",children:t.name}),t.badge?e("span",{className:"-mt-1 scale-90",children:t.badge}):null]})},t.id)})}),E=e("div",{ref:f,role:"list",onKeyDown:R,className:c("flex flex-col gap-0.5",r==="spotlight"&&"p-1.5"),children:a.map(t=>{const d=t.id===n,V=r==="spotlight"&&t.id===l?.id;return e("div",{role:"listitem",children:i(y,{app:t,current:d,onChoose:v,onFocus:()=>L(t.id),onMouseEnter:()=>L(t.id),className:c("group/app flex w-full cursor-pointer items-center gap-3 rounded-[calc(10px*var(--radius-scale))] px-2 py-2 text-left transition-colors duration-150",V?"bg-raised shadow-[var(--lit),0_1px_2px_rgba(5,8,22,.06),0_4px_12px_-4px_rgba(5,8,22,.14)] ring-1 ring-border":"hover:bg-hover focus-visible:bg-hover"),children:[e(x,{app:t,size:r==="spotlight"?"sm":"md"}),i("span",{className:"min-w-0 flex-1",children:[i("span",{className:"flex items-center gap-2",children:[e("span",{className:c("truncate text-[13px] font-medium",d?"text-primary":"text-text"),children:t.name}),t.badge]}),t.description&&r==="list"?e("span",{className:"mt-0.5 block truncate text-[11.5px] text-muted",children:t.description}):null]}),d?e(w,{className:"size-4 shrink-0 text-primary"}):e(M,{className:"size-4 shrink-0 text-muted opacity-0 transition-[opacity,transform] duration-150 group-hover/app:translate-x-0.5 group-hover/app:-translate-y-0.5 group-hover/app:opacity-100"})]})},t.id)})}),F=i(_,{children:[P,i("div",{className:"grid min-h-[260px] grid-cols-1 sm:grid-cols-[220px_1fr]",children:[e("div",{className:"border-border bg-surface sm:border-r",children:E}),l?i("div",{className:"hidden flex-col p-5 animate-[wave-in_220ms_var(--ease)] sm:flex",children:[e(x,{app:l,size:"lg",glow:!0}),i("div",{className:"mt-4 flex items-center gap-2",children:[e("p",{className:"disp text-[16px] font-semibold text-text",children:l.name}),l.badge]}),l.description?e("p",{className:"mt-1 text-[12.5px] leading-[18px] text-body",children:l.description}):null,e("div",{className:"mt-auto pt-5",children:l.id===n?i("p",{className:"flex items-center gap-1.5 text-[12px] font-medium text-primary",children:[e(w,{className:"size-3.5"})," You are here"]}):i(y,{app:l,current:!1,onChoose:v,className:"inline-flex h-8 cursor-pointer items-center gap-1.5 rounded-full bg-[linear-gradient(135deg,var(--brand-1),var(--brand-2))] px-3.5 text-[12.5px] font-medium text-white shadow-[inset_0_1px_0_rgba(255,255,255,.25),0_6px_14px_-6px_color-mix(in_srgb,var(--brand-1)_70%,transparent)] transition-[filter] hover:brightness-110",children:["Open ",l.name," ",e(M,{className:"size-3.5"})]})})]},l.id):null]}),u?e("div",{className:"border-t border-border bg-surface px-4 py-2.5 text-[12px] text-muted",children:u}):null]});return i(b.Root,{open:h,onOpenChange:A,children:[e(b.Trigger,{"aria-label":m?`${m.name}. Switch app`:"Switch app",className:c("inline-flex shrink-0 cursor-pointer items-center justify-center outline-none transition-colors duration-150 focus-visible:ring-2 focus-visible:ring-primary/45",U[o],D),children:o==="chip"&&m?i(_,{children:[e("span",{className:"[&_svg]:!size-3.5",children:e(x,{app:m,size:"sm"})}),e("span",{className:"max-w-[120px] truncate",children:m.name}),e("span",{className:"text-muted",children:e(T,{open:h})})]}):e(T,{open:h})}),e(b.Portal,{children:e(b.Content,{"data-pop":"",align:C,side:O,sideOffset:8,collisionPadding:12,onOpenAutoFocus:t=>{t.preventDefault();const d=f.current;(d?.querySelector("[data-launcher-app][aria-current]")??d?.querySelector("[data-launcher-app]"))?.focus()},className:c("z-50 overflow-hidden rounded-[calc(18px*var(--radius-scale))] border p-2.5 shadow-elev3 outline-none",G[r]),children:r==="spotlight"?F:i(_,{children:[e("div",{className:"px-1 pt-1",children:P}),z?q:E,u?e("div",{className:"mt-2 border-t border-border px-1 pt-2.5 text-[12px] text-muted",children:u}):null]})})})]})}export{W as AppLauncher};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{Fragment as P,jsx as e,jsxs as
|
|
1
|
+
"use client";import{Fragment as P,jsx as e,jsxs as n}from"react/jsx-runtime";import{Check as z,Loader2 as I,Pencil as R,PenLine as E,Trash2 as H}from"lucide-react";import*as i from"react";import{cn as D}from"../../lib/utils.js";import{Button as w}from"../ui/button.js";import{Dialog as K,DialogBody as O,DialogContent as V,DialogDescription as $,DialogFooter as q,DialogHeader as A,DialogTitle as F}from"../ui/dialog.js";import{Input as W}from"../ui/input.js";import{Label as k}from"../ui/label.js";import{ConfirmDialog as G}from"../ui/confirm-dialog.js";import{Select as N,SelectContent as T,SelectItem as B,SelectTrigger as L,SelectValue as M}from"../ui/select.js";function ee({value:l,display:m,edit:r,onSave:x,align:c}){const[g,y]=i.useState(!1),[o,v]=i.useState(""),[p,u]=i.useState(null),[C,f]=i.useState("idle"),s=i.useRef(null),d=()=>{v(l==null?"":String(l)),u(null),y(!0)};i.useEffect(()=>{g&&(s.current?.focus(),s.current&&"select"in s.current&&r.type!=="select"&&s.current.select())},[g,r.type]);const b=async()=>{if(o===String(l??""))return y(!1);const a=o.trim()===""&&!r.allowEmpty?r.requiredMessage??"Can't be empty":r.validate?.(o)??null;if(a)return u(a);try{f("saving"),await x(o),y(!1),f("saved"),window.setTimeout(()=>f("idle"),900)}catch(S){f("idle"),u(S instanceof Error?S.message:String(S))}};if(!g)return n("button",{type:"button",onClick:a=>{a.stopPropagation(),d()},className:D("group/edit -mx-1.5 flex w-[calc(100%+12px)] min-w-0 cursor-text items-center gap-1.5 rounded-[calc(6px*var(--radius-scale))] px-1.5 py-0.5 text-left outline-none transition-colors","hover:bg-primary-subtle/60 focus-visible:ring-2 focus-visible:ring-primary/40",c==="right"&&"flex-row-reverse text-right",C==="saved"&&"wm-saved"),children:[e("span",{className:"min-w-0 flex-1 truncate",children:m}),C==="saved"?e(z,{className:"size-3.5 shrink-0 text-success"}):e(R,{className:"size-3 shrink-0 text-muted opacity-0 transition-opacity group-hover/edit:opacity-70"})]});const t="h-8 w-full rounded-[calc(7px*var(--radius-scale))] border border-primary bg-raised px-2 text-[13px] text-text outline-none ring-2 ring-primary/20 "+(p?"!border-danger !ring-danger/20 ":"")+(c==="right"?"text-right ":""),h=a=>{a.stopPropagation(),a.key==="Enter"?(a.preventDefault(),b()):a.key==="Escape"&&(a.preventDefault(),y(!1))};return n("div",{className:"relative -my-1",onClick:a=>a.stopPropagation(),children:[r.type==="select"?e("select",{ref:s,value:o,onChange:a=>v(a.target.value),onKeyDown:h,onBlur:()=>{b()},className:D(t,"cursor-pointer"),children:(r.options??[]).map(a=>e("option",{value:a.value,children:a.label},a.value))}):e("input",{ref:s,type:r.type==="number"?"number":r.type==="date"?"date":"text",value:o,onChange:a=>{v(a.target.value),u(null)},onKeyDown:h,onBlur:()=>{b()},"aria-invalid":!!p,className:D(t,r.type==="number"&&"num")}),C==="saving"?e(I,{className:"absolute right-2 top-1/2 size-3.5 -translate-y-1/2 animate-spin text-primary"}):null,p?e("p",{role:"alert",className:"absolute left-0 top-full z-20 mt-1 whitespace-nowrap rounded-[calc(6px*var(--radius-scale))] bg-danger px-2 py-1 text-[11.5px] font-medium text-white shadow-elev2",children:p}):null]})}function te({count:l,columns:m,onApply:r}){const[x,c]=i.useState(!1),[g,y]=i.useState(m[0]?.id??""),[o,v]=i.useState(""),[p,u]=i.useState(null),[C,f]=i.useState(!1),s=m.find(t=>t.id===g)??m[0];if(!s)return null;const d=s.edit,b=async()=>{const t=o.trim()===""&&!d.allowEmpty?d.requiredMessage??"Can't be empty":d.validate?.(o)??null;if(t)return u(t);f(!0);try{await r(s.id,o),c(!1),v("")}catch(h){u(h instanceof Error?h.message:String(h))}finally{f(!1)}};return n(P,{children:[n(w,{variant:"ghost",size:"sm",onClick:()=>c(!0),children:[e(E,{}),"Edit"]}),e(K,{open:x,onOpenChange:c,children:n(V,{variant:"center",size:"sm",children:[n(A,{icon:e(E,{}),eyebrow:`${l} selected`,children:[n(F,{children:["Edit ",l," rows"]}),e($,{children:"The value replaces what each selected row has in that column."})]}),n(O,{className:"space-y-4",children:[n("div",{className:"space-y-1.5",children:[e(k,{children:"Column"}),n(N,{value:s.id,onValueChange:t=>{y(t),v(""),u(null)},children:[e(L,{children:e(M,{})}),e(T,{children:m.map(t=>e(B,{value:t.id,children:t.label},t.id))})]})]}),n("div",{className:"space-y-1.5",children:[e(k,{children:"New value"}),d.type==="select"?n(N,{value:o||void 0,onValueChange:t=>{v(t),u(null)},children:[e(L,{"aria-invalid":!!p,children:e(M,{placeholder:"Choose\u2026"})}),e(T,{children:(d.options??[]).map(t=>e(B,{value:t.value,children:t.label},t.value))})]}):e(W,{type:d.type==="number"?"number":d.type==="date"?"date":"text",value:o,state:p?"error":"default",onChange:t=>{v(t.target.value),u(null)},onKeyDown:t=>t.key==="Enter"&&void b()}),p?e("p",{role:"alert",className:"text-[12px] text-danger",children:p}):null]})]}),n(q,{children:[e(w,{onClick:()=>c(!1),children:"Cancel"}),n(w,{variant:"primary",loading:C,onClick:()=>{b()},children:["Apply to ",l," rows"]})]})]})})]})}function ae({count:l,names:m,typeAbove:r=5,onConfirm:x}){const[c,g]=i.useState(!1);return n(P,{children:[n(w,{variant:"ghost",size:"sm",className:"text-danger hover:bg-danger-subtle hover:text-danger",onClick:()=>g(!0),children:[e(H,{}),"Delete"]}),e(G,{open:c,onOpenChange:g,title:`Delete ${l} ${l===1?"row":"rows"}?`,description:"They will be removed for everyone. This cannot be undone.",items:m,confirmWord:l>=r?"DELETE":void 0,confirmLabel:`Delete ${l}`,onConfirm:x})]})}export{ae as BulkDelete,te as BulkEdit,ee as EditableCell};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as o,jsxs as f}from"react/jsx-runtime";import{ListFilter as T,Plus as L,Trash2 as P,X as q}from"lucide-react";import*as B from"react";import{cn as D}from"../../lib/utils.js";import{Button as g}from"../ui/button.js";import{parseIsoDay as I,toIsoDay as h}from"../ui/calendar.js";import{Checkbox as O}from"../ui/checkbox.js";import{DatePicker as z,DateRangePicker as E}from"../ui/date-picker.js";import{Input as v}from"../ui/input.js";import{Popover as V,PopoverContent as j,PopoverTrigger as M}from"../ui/popover.js";import{Segmented as $}from"../ui/segmented.js";import{Select as F,SelectContent as N,SelectItem as A,SelectTrigger as _,SelectValue as w}from"../ui/select.js";const
|
|
1
|
+
"use client";import{jsx as o,jsxs as f}from"react/jsx-runtime";import{ListFilter as T,Plus as L,Trash2 as P,X as q}from"lucide-react";import*as B from"react";import{cn as D}from"../../lib/utils.js";import{Button as g}from"../ui/button.js";import{parseIsoDay as I,toIsoDay as h}from"../ui/calendar.js";import{Checkbox as O}from"../ui/checkbox.js";import{DatePicker as z,DateRangePicker as E}from"../ui/date-picker.js";import{Input as v}from"../ui/input.js";import{Popover as V,PopoverContent as j,PopoverTrigger as M}from"../ui/popover.js";import{Segmented as $}from"../ui/segmented.js";import{Select as F,SelectContent as N,SelectItem as A,SelectTrigger as _,SelectValue as w}from"../ui/select.js";const ae={match:"and",rules:[]},S={text:["contains","not_contains","is","is_not","starts_with","empty","not_empty"],select:["any_of","none_of","empty","not_empty"],number:["eq","neq","gt","gte","lt","lte","between","empty","not_empty"],date:["on","before","after","between","empty","not_empty"]},b={filter:"Filter",filters:"Filters",addFilter:"Add filter",clearAll:"Clear all",matchAll:"All rules",matchAny:"Any rule",where:"Where",and:"and",or:"or",value:"Value",none:"No filters yet. Add one to narrow the rows.",ops:{contains:"contains",not_contains:"does not contain",is:"is",is_not:"is not",starts_with:"starts with",any_of:"is any of",none_of:"is none of",eq:"=",neq:"\u2260",gt:">",gte:"\u2265",lt:"<",lte:"\u2264",between:"is between",on:"is on",before:"is before",after:"is after",empty:"is empty",not_empty:"is not empty"}},x=e=>e==="empty"||e==="not_empty";function ie(e,n){const p=[];for(const c of e){const r=c.meta?.filter;if(!r)continue;const a="accessorKey"in c?String(c.accessorKey):void 0,t="accessorFn"in c?c.accessorFn:void 0,i=c.id??a;if(!i||!a&&!t)continue;const l=(y,u)=>t?t(y,u):y[a];let d=r.options??[];r.type==="select"&&!r.options&&(d=[...new Set(n.map((u,m)=>l(u,m)).filter(u=>u!=null&&u!=="").map(String))].sort().map(u=>({value:u,label:u})));const s=r.label??(typeof c.header=="string"?c.header:i);p.push({id:i,label:s,type:r.type,options:d,get:l})}return p}function K(e){return e instanceof Date?h(e):typeof e=="number"?h(new Date(e)):typeof e=="string"&&I(e)?e.slice(0,10):null}function W(e,n,p){const c=p==null||p==="";if(e.op==="empty")return c;if(e.op==="not_empty")return!c;const r=e.value,a=Array.isArray(r)?r[0]??"":r;if(n.type==="text"){if(a==="")return!0;const t=String(p??"").toLowerCase(),i=a.toLowerCase();if(e.op==="contains")return t.includes(i);if(e.op==="not_contains")return!t.includes(i);if(e.op==="is")return t===i;if(e.op==="is_not")return t!==i;if(e.op==="starts_with")return t.startsWith(i)}if(n.type==="select"){const t=Array.isArray(r)?r:[r];if(!t.length)return!0;const i=t.includes(String(p??""));return e.op==="none_of"?!i:i}if(n.type==="number"){const t=typeof p=="number"?p:Number(p);if(e.op==="between"){const[l,d]=(Array.isArray(r)?r:[r,""]).map(s=>s===""?null:Number(s));return(l===null||t>=l)&&(d===null||t<=d)}if(a==="")return!0;const i=Number(a);return Number.isNaN(t)?!1:{eq:t===i,neq:t!==i,gt:t>i,gte:t>=i,lt:t<i,lte:t<=i}[e.op]??!0}if(n.type==="date"){const t=K(p);if(e.op==="between"){const[i,l]=Array.isArray(r)?r:[r,""];return!i&&!l?!0:!!t&&(!i||t>=i)&&(!l||t<=l)}return a===""?!0:t?e.op==="on"?t===a:e.op==="before"?t<a:t>a:!1}return!0}function se(e,n,p){const c=p.rules.filter(r=>n.some(a=>a.id===r.column));return c.length?e.filter((r,a)=>{const t=c.map(i=>{const l=n.find(d=>d.id===i.column);return W(i,l,l.get(r,a))});return p.match==="and"?t.every(Boolean):t.some(Boolean)}):e}const C=e=>x(e.op)||(Array.isArray(e.value)?e.value.some(n=>n!==""):e.value!=="");let X=0;const Y=()=>`f${Date.now().toString(36)}${(X++).toString(36)}`;function k(e){const n=S[e.type][0];return{id:Y(),column:e.id,op:n,value:e.type==="select"?[]:n==="between"?["",""]:""}}function G({rule:e,field:n,onChange:p,L:c}){if(x(e.op))return o("div",{className:"h-ctl"});if(n.type==="select"){const r=Array.isArray(e.value)?e.value:[];return o("div",{className:"max-h-40 space-y-0.5 overflow-y-auto rounded-ctl border border-border2 bg-raised p-1.5",children:n.options.map(a=>f("label",{className:"flex cursor-pointer items-center gap-2 rounded-[calc(6px*var(--radius-scale))] px-1.5 py-1 text-[13px] text-text hover:bg-hover",children:[o(O,{checked:r.includes(a.value),onCheckedChange:t=>p(t?[...r,a.value]:r.filter(i=>i!==a.value))}),o("span",{className:"truncate",children:a.label})]},a.value))})}if(n.type==="date"){if(e.op==="between"){const[r="",a=""]=Array.isArray(e.value)?e.value:[];return o(E,{value:{from:r,to:a},onChange:t=>p([t.from,t.to]),numberOfMonths:1,presets:[]})}return o(z,{value:typeof e.value=="string"?e.value:"",onChange:p})}if(e.op==="between"){const[r="",a=""]=Array.isArray(e.value)?e.value:[];return f("div",{className:"flex items-center gap-1.5",children:[o(v,{type:"number",value:r,onChange:t=>p([t.target.value,a]),placeholder:"min",className:"num"}),o("span",{className:"text-muted",children:"\u2013"}),o(v,{type:"number",value:a,onChange:t=>p([r,t.target.value]),placeholder:"max",className:"num"})]})}return o(v,{type:n.type==="number"?"number":"text",value:typeof e.value=="string"?e.value:"",onChange:r=>p(r.target.value),placeholder:c.value,className:D(n.type==="number"&&"num")})}function le({fields:e,value:n,onChange:p,labels:c,open:r,onOpenChange:a}){const t={...b,...c,ops:{...b.ops,...c?.ops}},i=n.rules.filter(C).length,l=s=>p({...n,rules:s}),d=(s,y)=>l(n.rules.map(u=>u.id===s?{...u,...y}:u));return f(V,{open:r,onOpenChange:a,children:[o(M,{asChild:!0,children:f(g,{variant:i?"subtle":"secondary",size:"sm",children:[o(T,{}),t.filter,i?o("span",{className:"num grid h-[18px] min-w-[18px] place-items-center rounded-full bg-primary px-1 text-[10.5px] font-semibold text-white",children:i}):null]})}),f(j,{align:"start",className:"w-[min(640px,calc(100vw-24px))] p-0",children:[f("div",{className:"flex items-center justify-between gap-3 border-b border-border px-4 py-3",children:[o("p",{className:"disp text-[14px] font-semibold text-text",children:t.filters}),n.rules.length>1?o($,{ariaLabel:"Match",value:n.match,onChange:s=>p({...n,match:s}),options:[{value:"and",label:t.matchAll},{value:"or",label:t.matchAny}]}):null]}),f("div",{className:"max-h-[52vh] space-y-2.5 overflow-y-auto px-4 py-3",children:[n.rules.length===0?o("p",{className:"py-4 text-center text-[13px] text-muted",children:t.none}):null,n.rules.map((s,y)=>{const u=e.find(m=>m.id===s.column)??e[0];return f("div",{className:"grid grid-cols-[44px_1fr_auto] items-start gap-2 sm:grid-cols-[44px_150px_150px_1fr_auto]",children:[o("span",{className:"pt-2 text-right text-[12px] font-medium text-muted",children:y===0?t.where:n.match==="and"?t.and:t.or}),f(F,{value:u.id,onValueChange:m=>d(s.id,{...k(e.find(R=>R.id===m)),id:s.id}),children:[o(_,{className:"max-sm:col-span-1",children:o(w,{})}),o(N,{children:e.map(m=>o(A,{value:m.id,children:m.label},m.id))})]}),o("button",{type:"button","aria-label":"Remove rule",onClick:()=>l(n.rules.filter(m=>m.id!==s.id)),className:"grid size-ctl cursor-pointer place-items-center rounded-ctl text-muted transition-colors hover:bg-danger-subtle hover:text-danger sm:order-last",children:o(P,{className:"size-4"})}),o("div",{className:"col-start-2 sm:col-start-auto",children:f(F,{value:s.op,onValueChange:m=>d(s.id,{op:m,value:u.type==="select"?Array.isArray(s.value)?s.value:[]:m==="between"?["",""]:Array.isArray(s.value)?"":s.value}),children:[o(_,{children:o(w,{})}),o(N,{children:S[u.type].map(m=>o(A,{value:m,children:t.ops[m]},m))})]})}),o("div",{className:"col-span-2 col-start-2 min-w-0 sm:col-span-1 sm:col-start-auto",children:o(G,{rule:s,field:u,onChange:m=>d(s.id,{value:m}),L:t})})]},s.id)})]}),f("div",{className:"flex items-center justify-between border-t border-border bg-surface px-4 py-2.5",children:[f(g,{size:"sm",variant:"ghost",disabled:!e.length,onClick:()=>l([...n.rules,k(e[0])]),children:[o(L,{})," ",t.addFilter]}),n.rules.length?o(g,{size:"sm",variant:"ghost",onClick:()=>p({...n,rules:[]}),children:t.clearAll}):null]})]})]})}function pe({fields:e,value:n,onChange:p,onEdit:c,labels:r}){const a={...b,...r,ops:{...b.ops,...r?.ops}},t=n.rules.filter(C);if(!t.length)return null;const i=(l,d)=>{if(x(l.op))return"";if(d.type==="select"){const s=(Array.isArray(l.value)?l.value:[l.value]).map(y=>d.options.find(u=>u.value===y)?.label??y);return s.length>2?`${s.slice(0,2).join(", ")} +${s.length-2}`:s.join(", ")}return Array.isArray(l.value)?l.value.filter(Boolean).join(" \u2013 "):l.value};return f("div",{className:"mb-2.5 flex flex-wrap items-center gap-1.5",children:[t.map((l,d)=>{const s=e.find(y=>y.id===l.column);return s?f(B.Fragment,{children:[d>0?o("span",{className:"text-[11px] font-medium uppercase text-muted",children:n.match==="and"?a.and:a.or}):null,f("span",{className:"inline-flex h-7 items-center gap-1 rounded-full border border-primary/20 bg-primary-subtle pl-2.5 pr-1 text-[12px] text-primary",children:[f("button",{type:"button",onClick:c,className:"cursor-pointer",children:[o("span",{className:"font-semibold",children:s.label})," ",o("span",{className:"opacity-80",children:a.ops[l.op]})," ",o("span",{className:"num font-medium",children:i(l,s)})]}),o("button",{type:"button","aria-label":"Remove filter",onClick:()=>p({...n,rules:n.rules.filter(y=>y.id!==l.id)}),className:"grid size-5 cursor-pointer place-items-center rounded-full transition-colors hover:bg-primary/15",children:o(q,{className:"size-3"})})]})]},l.id):null}),o("button",{type:"button",onClick:()=>p({...n,rules:[]}),className:"ml-1 cursor-pointer text-[12px] text-muted underline-offset-2 hover:text-text hover:underline",children:a.clearAll})]})}export{ae as EMPTY_FILTERS,b as FILTER_LABELS,le as FilterBuilder,pe as FilterChips,se as applyFilters,ie as filterFields};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
"use client";import{jsx as t,jsxs as n}from"react/jsx-runtime";import{flexRender as U,getCoreRowModel as Me,getFilteredRowModel as Re,getPaginationRowModel as Ne,getSortedRowModel as ke,useReactTable as Fe}from"@tanstack/react-table";import{ArrowDown as Pe,ArrowUp as ze,ArrowUpDown as Te,ChevronLeft as _e,ChevronRight as Ve,Columns3 as Ie,Download as te,FileDown as oe,FileSpreadsheet as Le,ListFilter as Ee,Pin as Ae,Search as Be,Star as Ue,X as $}from"lucide-react";import*as l from"react";import{toast as N}from"sonner";import{Button as m}from"../ui/button.js";import{Checkbox as ne}from"../ui/checkbox.js";import{DropdownMenu as K,DropdownMenuCheckboxItem as $e,DropdownMenuContent as O,DropdownMenuItem as S,DropdownMenuLabel as re,DropdownMenuSeparator as Ke,DropdownMenuTrigger as j}from"../ui/dropdown-menu.js";import{Input as Oe}from"../ui/input.js";import{cn as g}from"../../lib/utils.js";import{applyFilters as je,EMPTY_FILTERS as ae,FilterBuilder as He,FilterChips as qe,filterFields as Ge}from"./data-table-filters.js";import{BulkDelete as Qe,BulkEdit as Xe,EditableCell as Ye}from"./data-table-edit.js";const Je={default:"rounded-card border border-border bg-surface",striped:"rounded-card border border-border bg-surface",bordered:"rounded-card border border-border2 bg-raised",cards:"",minimal:""};function st({columns:b,data:f,getRowId:k,onRowClick:y,activeId:ie,searchPlaceholder:le="Search\u2026",pageSize:se=12,footer:H,emptyState:de,savedViews:F=[],toolbarExtra:ce,exportName:ge="waveinno-export",defaultFilters:ue=ae,onFiltersChange:pe,manualFiltering:q=!1,filterLabels:G,variant:d="default",onCellEdit:v,onBulkEdit:P,onBulkDelete:Q,getRowLabel:X,bulkActions:me,className:be}){const[fe,z]=l.useState([]),[we,T]=l.useState({}),[he,_]=l.useState({left:[],right:[]}),[V,w]=l.useState({}),[I,L]=l.useState(""),[E,A]=l.useState(-1),[Y,J]=l.useState(null),[C,xe]=l.useState(ue),[Se,W]=l.useState(!1),D=e=>{xe(e),pe?.(e)},h=l.useMemo(()=>Ge(b,f),[b,f]),Z=l.useMemo(()=>b.filter(e=>e.meta?.edit).map(e=>({id:e.id??("accessorKey"in e?String(e.accessorKey):""),label:typeof e.header=="string"?e.header:e.id??"",edit:e.meta.edit})).filter(e=>e.id),[b]),ye=l.useMemo(()=>q?f:je(f,h,C),[f,h,C,q]),ee=l.useMemo(()=>({id:"__select",size:36,enableSorting:!1,enableHiding:!1,header:({table:e})=>t(ne,{"aria-label":"Select all rows on this page",checked:e.getIsAllPageRowsSelected()?!0:e.getIsSomePageRowsSelected()?"indeterminate":!1,onCheckedChange:o=>e.toggleAllPageRowsSelected(!!o)}),cell:({row:e})=>t(ne,{"aria-label":"Select row",checked:e.getIsSelected(),onCheckedChange:o=>e.toggleSelected(!!o),onClick:o=>o.stopPropagation()})}),[]),ve=l.useMemo(()=>[ee,...b],[b,ee]),r=Fe({data:ye,columns:ve,state:{sorting:fe,columnVisibility:we,columnPinning:he,rowSelection:V,globalFilter:I},getRowId:e=>k(e),onSortingChange:z,onColumnVisibilityChange:T,onColumnPinningChange:_,onRowSelectionChange:w,onGlobalFilterChange:L,enableMultiSort:!0,enableColumnResizing:!0,columnResizeMode:"onChange",getCoreRowModel:Me(),getSortedRowModel:ke(),getFilteredRowModel:Re(),getPaginationRowModel:Ne(),initialState:{pagination:{pageSize:se}}}),M=r.getRowModel().rows,R=Object.keys(V).filter(e=>V[e]).length,Ce=e=>{if(e.key==="ArrowDown")e.preventDefault(),A(o=>Math.min(o+1,M.length-1));else if(e.key==="ArrowUp")e.preventDefault(),A(o=>Math.max(o-1,0));else if(e.key==="Enter"&&E>=0){e.preventDefault();const o=M[E];o&&y&&y(o.original)}},B=()=>{const e=r.getVisibleLeafColumns().filter(a=>a.id!=="__select"),o=e.map(a=>{const u=a.columnDef.header;return typeof u=="string"?u:a.id}),c=r.getFilteredRowModel().rows.map(a=>e.map(u=>{const x=a.getValue(u.id);return x==null?"":String(x)})),s=[o,...c].map(a=>a.map(u=>`"${u.replace(/"/g,'""')}"`).join(",")).join(`
|
|
2
|
-
`),p=URL.createObjectURL(new Blob([`\uFEFF${s}`],{type:"text/csv"})),i=document.createElement("a");i.href=p,i.download=`${ge}.csv`,i.click(),URL.revokeObjectURL(p),N.success(`Exported ${c.length} rows`)},De=e=>{J(e.id),z(e.sorting??[]),T(e.visibility??{}),_(e.pinning??{left:[],right:[]}),e.filters&&D(e.filters)};return n("div",{className:g("relative",be),children:[n("div",{className:"mb-2.5 flex flex-wrap items-center gap-2",children:[n("div",{className:"relative min-w-[200px] flex-1 sm:max-w-xs",children:[t(Be,{className:"pointer-events-none absolute left-2.5 top-1/2 size-3.5 -translate-y-1/2 text-muted"}),t(Oe,{value:I,onChange:e=>L(e.target.value),placeholder:le,className:"pl-8"}),I?t("button",{type:"button",onClick:()=>L(""),className:"absolute right-2 top-1/2 -translate-y-1/2 cursor-pointer text-muted hover:text-text","aria-label":"Clear search",children:t($,{className:"size-3.5"})}):null]}),h.length?t(He,{fields:h,value:C,onChange:D,labels:G,open:Se,onOpenChange:W}):null,ce,t("div",{className:"flex-1"}),F.length?n(K,{children:[t(j,{asChild:!0,children:n(m,{variant:"secondary",size:"sm",children:[t(Ue,{}),Y?F.find(e=>e.id===Y)?.name:"Saved views"]})}),n(O,{align:"end",children:[t(re,{children:"Saved views"}),F.map(e=>n(S,{onSelect:()=>De(e),children:[t(Ee,{}),e.name]},e.id)),t(Ke,{}),n(S,{onSelect:()=>{J(null),z([]),T({}),_({left:[],right:[]}),D(ae)},children:[t($,{}),"Reset to default"]})]})]}):null,n(K,{children:[t(j,{asChild:!0,children:n(m,{variant:"secondary",size:"sm",children:[t(Ie,{}),"Columns"]})}),n(O,{align:"end",className:"max-h-80 overflow-y-auto",children:[t(re,{children:"Visible columns"}),r.getAllLeafColumns().filter(e=>e.getCanHide()&&e.id!=="__select").map(e=>t($e,{checked:e.getIsVisible(),onCheckedChange:o=>e.toggleVisibility(!!o),onSelect:o=>o.preventDefault(),children:typeof e.columnDef.header=="string"?e.columnDef.header:e.id},e.id))]})]}),n(K,{children:[t(j,{asChild:!0,children:n(m,{variant:"secondary",size:"sm",children:[t(te,{}),"Export"]})}),n(O,{align:"end",children:[n(S,{onSelect:B,children:[t(oe,{}),"CSV"]}),n(S,{onSelect:B,children:[t(Le,{}),"Excel (.xlsx)"]}),n(S,{onSelect:()=>N.info("PDF export queued"),children:[t(oe,{}),"PDF"]})]})]})]}),t(qe,{fields:h,value:C,onChange:D,onEdit:()=>W(!0),labels:G}),t("div",{tabIndex:0,onKeyDown:Ce,role:"region","aria-label":"Data table",className:g("overflow-auto outline-none",Je[d],d==="cards"&&"-mx-1 px-1"),children:n("table",{className:g("w-full text-[13px]",d==="cards"?"border-separate border-spacing-y-1.5":"border-collapse"),children:[t("thead",{children:r.getHeaderGroups().map(e=>t("tr",{children:e.headers.map(o=>{const c=o.column.columnDef.meta,s=o.column.getIsSorted(),p=o.column.getCanSort(),i=o.column.getIsPinned();return t("th",{style:{width:o.getSize()},className:g("ov sticky top-0 z-10 whitespace-nowrap px-cellx py-2 text-left",d==="cards"?"bg-canvas":d==="minimal"?"border-b border-border bg-canvas":"border-b border-border bg-surface",d==="bordered"&&"border-r border-border bg-hover last:border-r-0",c?.sticky==="right"&&"right-0 z-20 shadow-[-8px_0_12px_-10px_rgba(5,8,22,.25)]",c?.align==="right"&&"text-right",i==="left"&&"left-0 z-20"),children:o.isPlaceholder?null:n("div",{className:g("group/th flex items-center gap-1",c?.align==="right"&&"justify-end"),children:[p?n("button",{type:"button",onClick:a=>o.column.toggleSorting(void 0,a.shiftKey),className:g("ov flex items-center gap-1",p&&"cursor-pointer hover:text-text",s&&"!text-primary"),children:[U(o.column.columnDef.header,o.getContext()),p?s==="asc"?t(ze,{className:"size-3"}):s==="desc"?t(Pe,{className:"size-3"}):t(Te,{className:"size-3 opacity-0 transition-opacity group-hover/th:opacity-60"}):null]}):t("span",{className:"ov flex items-center gap-1",children:U(o.column.columnDef.header,o.getContext())}),o.column.getCanPin()&&o.column.id!=="__select"?t("button",{type:"button","aria-label":i?"Unpin column":"Pin column left",onClick:()=>o.column.pin(i==="left"?!1:"left"),className:g("cursor-pointer transition-opacity",i?"text-primary":"opacity-0 group-hover/th:opacity-60 hover:!opacity-100"),children:t(Ae,{className:"size-3"})}):null,o.column.getCanResize()?t("span",{onMouseDown:o.getResizeHandler(),onTouchStart:o.getResizeHandler(),className:"absolute right-0 top-0 h-full w-1 cursor-col-resize select-none bg-transparent hover:bg-primary-muted","aria-hidden":!0}):null]})},o.id)})},e.id))}),t("tbody",{children:M.length===0?t("tr",{children:t("td",{colSpan:r.getVisibleLeafColumns().length,className:"p-0",children:de??t("div",{className:"px-6 py-14 text-center text-[13px] text-muted",children:"No rows match the current filters."})})}):M.map((e,o)=>{const c=k(e.original),s=ie===c;return t("tr",{onClick:()=>{A(o),y?.(e.original)},"aria-selected":s,className:g("group/row transition-[background-color,box-shadow,transform] duration-150",y&&"cursor-pointer",d==="striped"&&"even:bg-hover/45",d==="cards"?g("[&>td]:border-y [&>td]:border-border [&>td]:bg-raised [&>td:first-child]:rounded-l-[11px] [&>td:first-child]:border-l [&>td:last-child]:rounded-r-[11px] [&>td:last-child]:border-r","shadow-[0_1px_2px_rgba(5,8,22,.04)] hover:-translate-y-px hover:shadow-[0_6px_18px_-8px_rgba(5,8,22,.22)]",s&&"[&>td]:border-primary/40 [&>td]:bg-selected"):s?"bg-selected shadow-[inset_2px_0_var(--primary)]":E===o?"bg-hover":"hover:bg-hover"),children:e.getVisibleCells().map(i=>{const a=i.column.columnDef.meta,u=U(i.column.columnDef.cell,i.getContext());return t("td",{style:{height:d==="cards"?"calc(var(--row-h) + 10px)":"var(--row-h)"},className:g("whitespace-nowrap px-cellx py-celly",d==="cards"?"":d==="minimal"?"border-b border-dashed border-border":"border-b border-border",d==="bordered"&&"border-r border-border last:border-r-0",a?.sticky==="right"&&"sticky right-0 z-[1] bg-surface shadow-[-8px_0_12px_-10px_rgba(5,8,22,.25)] group-hover/row:bg-hover group-even/row:bg-inherit",a?.align==="right"&&"text-right",a?.mono&&"mono",a?.num&&"num",a?.strong&&"font-medium text-text"),children:a?.edit&&v?t(Ye,{value:i.getValue(),display:u,edit:a.edit,align:a.align,onSave:x=>v(e.original,i.column.id,x)}):u},i.id)})},e.id)})}),H?t("tfoot",{children:t("tr",{className:"border-t-2 border-border2 font-semibold text-text",children:H})}):null]})}),n("div",{className:"mt-2.5 flex flex-wrap items-center gap-3 text-xs text-muted",children:[t("span",{className:"num",children:r.getFilteredRowModel().rows.length===0?"0 rows":`${r.getState().pagination.pageIndex*r.getState().pagination.pageSize+1}\u2013${Math.min((r.getState().pagination.pageIndex+1)*r.getState().pagination.pageSize,r.getFilteredRowModel().rows.length)} of ${r.getFilteredRowModel().rows.length}`}),n("div",{className:"ml-auto flex items-center gap-1",children:[t(m,{variant:"ghost",size:"iconSm","aria-label":"Previous page",disabled:!r.getCanPreviousPage(),onClick:()=>r.previousPage(),children:t(_e,{})}),n("span",{className:"num px-1",children:[r.getState().pagination.pageIndex+1," /"," ",r.getPageCount()||1]}),t(m,{variant:"ghost",size:"iconSm","aria-label":"Next page",disabled:!r.getCanNextPage(),onClick:()=>r.nextPage(),children:t(Ve,{})})]})]}),R>0?n("div",{className:"anim-in fixed bottom-6 left-1/2 z-30 flex -translate-x-1/2 items-center gap-2 rounded-full border border-border bg-raised px-3 py-2 shadow-elev3",children:[n("span",{className:"num px-1 text-[13px] font-medium text-text",children:[R," selected"]}),t("span",{className:"h-4 w-px bg-border"}),n(m,{variant:"ghost",size:"sm",onClick:B,children:[t(te,{}),"Export"]}),Z.length&&(P||v)?t(Xe,{count:R,columns:Z,onApply:async(e,o)=>{const c=r.getSelectedRowModel().rows.map(s=>s.original);if(P)await P(c,e,o);else for(const s of c)await v(s,e,o);N.success(`Updated ${c.length} rows`),w({})}}):null,Q?t(Qe,{count:R,names:r.getSelectedRowModel().rows.map(e=>X?X(e.original):k(e.original)),onConfirm:async()=>{const e=r.getSelectedRowModel().rows.map(o=>o.original);await Q(e),N.success(`Deleted ${e.length} rows`),w({})}}):null,me?.(r.getSelectedRowModel().rows.map(e=>e.original),()=>w({})),t(m,{variant:"ghost",size:"iconSm","aria-label":"Clear selection",onClick:()=>w({}),children:t($,{})})]}):null]})}export{st as DataTable};
|
|
2
|
+
`),p=URL.createObjectURL(new Blob([`\uFEFF${s}`],{type:"text/csv"})),i=document.createElement("a");i.href=p,i.download=`${ge}.csv`,i.click(),URL.revokeObjectURL(p),N.success(`Exported ${c.length} rows`)},De=e=>{J(e.id),z(e.sorting??[]),T(e.visibility??{}),_(e.pinning??{left:[],right:[]}),e.filters&&D(e.filters)};return n("div",{className:g("relative",be),children:[n("div",{className:"mb-2.5 flex flex-wrap items-center gap-2",children:[n("div",{className:"relative min-w-[200px] flex-1 sm:max-w-xs",children:[t(Be,{className:"pointer-events-none absolute left-2.5 top-1/2 size-3.5 -translate-y-1/2 text-muted"}),t(Oe,{value:I,onChange:e=>L(e.target.value),placeholder:le,className:"pl-8"}),I?t("button",{type:"button",onClick:()=>L(""),className:"absolute right-2 top-1/2 -translate-y-1/2 cursor-pointer text-muted hover:text-text","aria-label":"Clear search",children:t($,{className:"size-3.5"})}):null]}),h.length?t(He,{fields:h,value:C,onChange:D,labels:G,open:Se,onOpenChange:W}):null,ce,t("div",{className:"flex-1"}),F.length?n(K,{children:[t(j,{asChild:!0,children:n(m,{variant:"secondary",size:"sm",children:[t(Ue,{}),Y?F.find(e=>e.id===Y)?.name:"Saved views"]})}),n(O,{align:"end",children:[t(re,{children:"Saved views"}),F.map(e=>n(S,{onSelect:()=>De(e),children:[t(Ee,{}),e.name]},e.id)),t(Ke,{}),n(S,{onSelect:()=>{J(null),z([]),T({}),_({left:[],right:[]}),D(ae)},children:[t($,{}),"Reset to default"]})]})]}):null,n(K,{children:[t(j,{asChild:!0,children:n(m,{variant:"secondary",size:"sm",children:[t(Ie,{}),"Columns"]})}),n(O,{align:"end",className:"max-h-80 overflow-y-auto",children:[t(re,{children:"Visible columns"}),r.getAllLeafColumns().filter(e=>e.getCanHide()&&e.id!=="__select").map(e=>t($e,{checked:e.getIsVisible(),onCheckedChange:o=>e.toggleVisibility(!!o),onSelect:o=>o.preventDefault(),children:typeof e.columnDef.header=="string"?e.columnDef.header:e.id},e.id))]})]}),n(K,{children:[t(j,{asChild:!0,children:n(m,{variant:"secondary",size:"sm",children:[t(te,{}),"Export"]})}),n(O,{align:"end",children:[n(S,{onSelect:B,children:[t(oe,{}),"CSV"]}),n(S,{onSelect:B,children:[t(Le,{}),"Excel (.xlsx)"]}),n(S,{onSelect:()=>N.info("PDF export queued"),children:[t(oe,{}),"PDF"]})]})]})]}),t(qe,{fields:h,value:C,onChange:D,onEdit:()=>W(!0),labels:G}),t("div",{tabIndex:0,onKeyDown:Ce,role:"region","aria-label":"Data table",className:g("overflow-auto outline-none",Je[d],d==="cards"&&"-mx-1 px-1"),children:n("table",{className:g("w-full text-[13px]",d==="cards"?"border-separate border-spacing-y-1.5":"border-collapse"),children:[t("thead",{children:r.getHeaderGroups().map(e=>t("tr",{children:e.headers.map(o=>{const c=o.column.columnDef.meta,s=o.column.getIsSorted(),p=o.column.getCanSort(),i=o.column.getIsPinned();return t("th",{style:{width:o.getSize()},className:g("ov sticky top-0 z-10 whitespace-nowrap px-cellx py-2 text-left",d==="cards"?"bg-canvas":d==="minimal"?"border-b border-border bg-canvas":"border-b border-border bg-surface",d==="bordered"&&"border-r border-border bg-hover last:border-r-0",c?.sticky==="right"&&"right-0 z-20 shadow-[-8px_0_12px_-10px_rgba(5,8,22,.25)]",c?.align==="right"&&"text-right",i==="left"&&"left-0 z-20"),children:o.isPlaceholder?null:n("div",{className:g("group/th flex items-center gap-1",c?.align==="right"&&"justify-end"),children:[p?n("button",{type:"button",onClick:a=>o.column.toggleSorting(void 0,a.shiftKey),className:g("ov flex items-center gap-1",p&&"cursor-pointer hover:text-text",s&&"!text-primary"),children:[U(o.column.columnDef.header,o.getContext()),p?s==="asc"?t(ze,{className:"size-3"}):s==="desc"?t(Pe,{className:"size-3"}):t(Te,{className:"size-3 opacity-0 transition-opacity group-hover/th:opacity-60"}):null]}):t("span",{className:"ov flex items-center gap-1",children:U(o.column.columnDef.header,o.getContext())}),o.column.getCanPin()&&o.column.id!=="__select"?t("button",{type:"button","aria-label":i?"Unpin column":"Pin column left",onClick:()=>o.column.pin(i==="left"?!1:"left"),className:g("cursor-pointer transition-opacity",i?"text-primary":"opacity-0 group-hover/th:opacity-60 hover:!opacity-100"),children:t(Ae,{className:"size-3"})}):null,o.column.getCanResize()?t("span",{onMouseDown:o.getResizeHandler(),onTouchStart:o.getResizeHandler(),className:"absolute right-0 top-0 h-full w-1 cursor-col-resize select-none bg-transparent hover:bg-primary-muted","aria-hidden":!0}):null]})},o.id)})},e.id))}),t("tbody",{children:M.length===0?t("tr",{children:t("td",{colSpan:r.getVisibleLeafColumns().length,className:"p-0",children:de??t("div",{className:"px-6 py-14 text-center text-[13px] text-muted",children:"No rows match the current filters."})})}):M.map((e,o)=>{const c=k(e.original),s=ie===c;return t("tr",{onClick:()=>{A(o),y?.(e.original)},"aria-selected":s,className:g("group/row transition-[background-color,box-shadow,transform] duration-150",y&&"cursor-pointer",d==="striped"&&"even:bg-hover/45",d==="cards"?g("[&>td]:border-y [&>td]:border-border [&>td]:bg-raised [&>td:first-child]:rounded-l-[calc(11px*var(--radius-scale))] [&>td:first-child]:border-l [&>td:last-child]:rounded-r-[calc(11px*var(--radius-scale))] [&>td:last-child]:border-r","shadow-[0_1px_2px_rgba(5,8,22,.04)] hover:-translate-y-px hover:shadow-[0_6px_18px_-8px_rgba(5,8,22,.22)]",s&&"[&>td]:border-primary/40 [&>td]:bg-selected"):s?"bg-selected shadow-[inset_2px_0_var(--primary)]":E===o?"bg-hover":"hover:bg-hover"),children:e.getVisibleCells().map(i=>{const a=i.column.columnDef.meta,u=U(i.column.columnDef.cell,i.getContext());return t("td",{style:{height:d==="cards"?"calc(var(--row-h) + 10px)":"var(--row-h)"},className:g("whitespace-nowrap px-cellx py-celly",d==="cards"?"":d==="minimal"?"border-b border-dashed border-border":"border-b border-border",d==="bordered"&&"border-r border-border last:border-r-0",a?.sticky==="right"&&"sticky right-0 z-[1] bg-surface shadow-[-8px_0_12px_-10px_rgba(5,8,22,.25)] group-hover/row:bg-hover group-even/row:bg-inherit",a?.align==="right"&&"text-right",a?.mono&&"mono",a?.num&&"num",a?.strong&&"font-medium text-text"),children:a?.edit&&v?t(Ye,{value:i.getValue(),display:u,edit:a.edit,align:a.align,onSave:x=>v(e.original,i.column.id,x)}):u},i.id)})},e.id)})}),H?t("tfoot",{children:t("tr",{className:"border-t-2 border-border2 font-semibold text-text",children:H})}):null]})}),n("div",{className:"mt-2.5 flex flex-wrap items-center gap-3 text-xs text-muted",children:[t("span",{className:"num",children:r.getFilteredRowModel().rows.length===0?"0 rows":`${r.getState().pagination.pageIndex*r.getState().pagination.pageSize+1}\u2013${Math.min((r.getState().pagination.pageIndex+1)*r.getState().pagination.pageSize,r.getFilteredRowModel().rows.length)} of ${r.getFilteredRowModel().rows.length}`}),n("div",{className:"ml-auto flex items-center gap-1",children:[t(m,{variant:"ghost",size:"iconSm","aria-label":"Previous page",disabled:!r.getCanPreviousPage(),onClick:()=>r.previousPage(),children:t(_e,{})}),n("span",{className:"num px-1",children:[r.getState().pagination.pageIndex+1," /"," ",r.getPageCount()||1]}),t(m,{variant:"ghost",size:"iconSm","aria-label":"Next page",disabled:!r.getCanNextPage(),onClick:()=>r.nextPage(),children:t(Ve,{})})]})]}),R>0?n("div",{className:"anim-in fixed bottom-6 left-1/2 z-30 flex -translate-x-1/2 items-center gap-2 rounded-full border border-border bg-raised px-3 py-2 shadow-elev3",children:[n("span",{className:"num px-1 text-[13px] font-medium text-text",children:[R," selected"]}),t("span",{className:"h-4 w-px bg-border"}),n(m,{variant:"ghost",size:"sm",onClick:B,children:[t(te,{}),"Export"]}),Z.length&&(P||v)?t(Xe,{count:R,columns:Z,onApply:async(e,o)=>{const c=r.getSelectedRowModel().rows.map(s=>s.original);if(P)await P(c,e,o);else for(const s of c)await v(s,e,o);N.success(`Updated ${c.length} rows`),w({})}}):null,Q?t(Qe,{count:R,names:r.getSelectedRowModel().rows.map(e=>X?X(e.original):k(e.original)),onConfirm:async()=>{const e=r.getSelectedRowModel().rows.map(o=>o.original);await Q(e),N.success(`Deleted ${e.length} rows`),w({})}}):null,me?.(r.getSelectedRowModel().rows.map(e=>e.original),()=>w({})),t(m,{variant:"ghost",size:"iconSm","aria-label":"Clear selection",onClick:()=>w({}),children:t($,{})})]}):null]})}export{st as DataTable};
|
|
@@ -9,6 +9,7 @@ export type { ColumnDef } from "@tanstack/react-table";
|
|
|
9
9
|
export * from "./kanban";
|
|
10
10
|
export * from "./kpi-card";
|
|
11
11
|
export * from "./money";
|
|
12
|
+
export * from "./org-chart";
|
|
12
13
|
export * from "./page-header";
|
|
13
14
|
export * from "./page-hero";
|
|
14
15
|
export * from "./page-shell";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export*from"./activity-feed.js";export*from"./app-launcher.js";export*from"./data-table.js";export*from"./data-table-cells.js";export*from"./data-table-edit.js";export*from"./data-table-filters.js";export*from"./kanban.js";export*from"./kpi-card.js";export*from"./money.js";export*from"./page-header.js";export*from"./page-hero.js";export*from"./page-shell.js";export*from"./stat-card.js";export*from"./states.js";export*from"./timeline.js";
|
|
1
|
+
export*from"./activity-feed.js";export*from"./app-launcher.js";export*from"./data-table.js";export*from"./data-table-cells.js";export*from"./data-table-edit.js";export*from"./data-table-filters.js";export*from"./kanban.js";export*from"./kpi-card.js";export*from"./money.js";export*from"./org-chart.js";export*from"./page-header.js";export*from"./page-hero.js";export*from"./page-shell.js";export*from"./stat-card.js";export*from"./states.js";export*from"./timeline.js";
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
/**
|
|
3
|
+
* OrgChart — who reports to whom: a company, a site's staff, a franchise.
|
|
4
|
+
*
|
|
5
|
+
* A top-down tree with rounded connectors. Each person with reports carries a
|
|
6
|
+
* count that folds and unfolds their team; the toolbar zooms, fits the chart
|
|
7
|
+
* to the box, and opens or closes every branch. Drag the background to pan,
|
|
8
|
+
* Ctrl/⌘ + wheel to zoom. Departments get a colour (pass `departments`, or
|
|
9
|
+
* one is chosen from the name) that marks each card.
|
|
10
|
+
*
|
|
11
|
+
* Looks:
|
|
12
|
+
* card — the default: a card per person with photo, role and department.
|
|
13
|
+
* gradient — the top of the tree in the brand gradient, department-coloured cards below.
|
|
14
|
+
* avatar — photo-first: large round portraits with names under them.
|
|
15
|
+
* compact — small pills, for large organisations.
|
|
16
|
+
* list — an indented outline with guide lines, for phones and very wide teams.
|
|
17
|
+
*/
|
|
18
|
+
export type OrgChartVariant = "card" | "gradient" | "avatar" | "compact" | "list";
|
|
19
|
+
export interface OrgNode {
|
|
20
|
+
id: string;
|
|
21
|
+
name: string;
|
|
22
|
+
title?: string;
|
|
23
|
+
department?: string;
|
|
24
|
+
/** Photo URL; without one, initials. */
|
|
25
|
+
avatar?: string;
|
|
26
|
+
/** Beside the name: "New", "On leave". */
|
|
27
|
+
badge?: React.ReactNode;
|
|
28
|
+
children?: OrgNode[];
|
|
29
|
+
}
|
|
30
|
+
export interface OrgChartProps {
|
|
31
|
+
data: OrgNode;
|
|
32
|
+
variant?: OrgChartVariant;
|
|
33
|
+
/** Department → colour. Departments not listed get one from a palette. */
|
|
34
|
+
departments?: Record<string, string>;
|
|
35
|
+
/** Ids folded at first. Or `collapseDepth` folds everything below a depth. */
|
|
36
|
+
defaultCollapsed?: string[];
|
|
37
|
+
collapseDepth?: number;
|
|
38
|
+
selected?: string;
|
|
39
|
+
onSelect?: (node: OrgNode) => void;
|
|
40
|
+
/** Height of the chart box (not used by `list`). */
|
|
41
|
+
height?: number;
|
|
42
|
+
className?: string;
|
|
43
|
+
}
|
|
44
|
+
declare const ids: (n: OrgNode) => string[];
|
|
45
|
+
export declare function OrgChart({ data, variant, departments, defaultCollapsed, collapseDepth, selected, onSelect, height, className, }: OrgChartProps): React.JSX.Element;
|
|
46
|
+
/** Every id in a tree: handy for "expand all" outside the chart. */
|
|
47
|
+
export declare const orgIds: typeof ids;
|
|
48
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use client";import{jsx as e,jsxs as s}from"react/jsx-runtime";import{ChevronDown as H,ChevronRight as L,ChevronsDownUp as D,ChevronsUpDown as W,Maximize2 as A,Minus as V,Plus as B}from"lucide-react";import*as z from"react";import{cn as p}from"../../lib/utils.js";import{Avatar as C}from"../ui/avatar.js";const R=["#4f46e5","#0ea5e9","#10b981","#f59e0b","#e11d48","#7c3aed","#0d9488","#ea580c"],F=t=>[...t].reduce((u,d)=>u*31+d.charCodeAt(0)>>>0,7),S=t=>(t.children??[]).reduce((u,d)=>u+1+S(d),0),T=t=>[t.id,...(t.children??[]).flatMap(T)];function Z({data:t,variant:u="card",departments:d,defaultCollapsed:h,collapseDepth:w,selected:N,onSelect:k,height:c=520,className:r}){const x=z.useMemo(()=>{if(h)return new Set(h);if(w===void 0)return new Set;const g=new Set,f=(o,y)=>{y>=w&&o.children?.length&&g.add(o.id),o.children?.forEach(l=>f(l,y+1))};return f(t,0),g},[t,h,w]),[n,m]=z.useState(x),i=g=>m(f=>{const o=new Set(f);return o.has(g)?o.delete(g):o.add(g),o}),v=g=>g.department?d?.[g.department]??R[F(g.department)%R.length]:"var(--primary)";return u==="list"?e(U,{data:t,folded:n,toggle:i,tone:v,selected:N,onSelect:k,className:r}):e(I,{data:t,variant:u,folded:n,setFolded:m,toggle:i,tone:v,selected:N,onSelect:k,height:c,className:r})}function I({data:t,variant:u,folded:d,setFolded:h,toggle:w,tone:N,selected:k,onSelect:c,height:r,className:x}){const n=z.useRef(null),m=z.useRef(null),[i,v]=z.useState({x:0,y:24,z:1}),[g,f]=z.useState(!1),o=z.useRef(null),y=z.useCallback(()=>{const a=n.current,b=m.current;if(!a||!b)return;const _=Math.min(1,(a.clientWidth-48)/b.scrollWidth,(a.clientHeight-48)/b.scrollHeight);v({x:(a.clientWidth-b.scrollWidth*_)/2,y:24,z:Math.max(.3,_)})},[]);z.useLayoutEffect(y,[y]);const l=a=>{const b=n.current;b&&(f(!0),v(_=>{const $=Math.min(1.6,Math.max(.3,_.z*a)),M=b.clientWidth/2,E=b.clientHeight/2;return{z:$,x:M-(M-_.x)/_.z*$,y:E-(E-_.y)/_.z*$}}))},O="grid size-8 cursor-pointer place-items-center rounded-[calc(8px*var(--radius-scale))] text-muted outline-none transition-colors hover:bg-hover hover:text-text focus-visible:ring-2 focus-visible:ring-primary/40 [&_svg]:size-4";return s("div",{ref:n,className:p("relative overflow-hidden rounded-[calc(16px*var(--radius-scale))] border border-border bg-surface",x),style:{height:r,backgroundImage:"radial-gradient(color-mix(in srgb, var(--border2) 60%, transparent) 1px, transparent 1px)",backgroundSize:`${20*i.z}px ${20*i.z}px`,backgroundPosition:`${i.x}px ${i.y}px`,cursor:o.current?"grabbing":"grab"},onPointerDown:a=>{a.target.closest("button, a, input")||(f(!1),o.current={x:a.clientX,y:a.clientY,vx:i.x,vy:i.y},a.currentTarget.setPointerCapture(a.pointerId))},onPointerMove:a=>{const b=o.current;b&&v(_=>({..._,x:b.vx+a.clientX-b.x,y:b.vy+a.clientY-b.y}))},onPointerUp:()=>{o.current=null},onWheel:a=>{(a.ctrlKey||a.metaKey)&&(a.preventDefault(),l(a.deltaY<0?1.1:1/1.1))},children:[e("div",{ref:m,className:p("wm-org absolute left-0 top-0 w-max origin-top-left",g&&"transition-transform duration-300 ease-[var(--ease)]"),style:{transform:`translate(${i.x}px, ${i.y}px) scale(${i.z})`,"--org-line":u==="gradient"?"color-mix(in srgb, var(--primary) 35%, var(--border2))":"var(--border2)"},onTransitionEnd:()=>f(!1),children:e("ul",{children:e(P,{node:t,depth:0,variant:u,folded:d,toggle:w,tone:N,selected:k,onSelect:c})})}),s("div",{className:"absolute right-3 top-3 flex items-center gap-0.5 rounded-[calc(11px*var(--radius-scale))] border border-border bg-raised/90 p-1 shadow-[var(--lit),0_4px_14px_-6px_rgba(5,8,22,.25)] backdrop-blur",children:[e("button",{type:"button","aria-label":"Zoom out",className:O,onClick:()=>l(1/1.2),children:e(V,{})}),s("span",{className:"num w-11 text-center text-[11.5px] font-medium text-muted",children:[Math.round(i.z*100),"%"]}),e("button",{type:"button","aria-label":"Zoom in",className:O,onClick:()=>l(1.2),children:e(B,{})}),e("span",{className:"mx-0.5 h-5 w-px bg-border"}),e("button",{type:"button","aria-label":"Fit to the box",className:O,onClick:()=>{f(!0),y()},children:e(A,{})}),e("button",{type:"button","aria-label":"Expand everyone",className:O,onClick:()=>h(new Set),children:e(W,{})}),e("button",{type:"button","aria-label":"Collapse to the top",className:O,onClick:()=>h(new Set((t.children??[]).filter(a=>a.children?.length).map(a=>a.id))),children:e(D,{})})]})]})}function P({node:t,depth:u,variant:d,folded:h,toggle:w,tone:N,selected:k,onSelect:c}){const r=t.children??[],x=r.length>0&&!h.has(t.id),n=N(t),m=k===t.id,i=S(t),v=r.length?s("button",{type:"button",onClick:()=>w(t.id),"aria-expanded":x,"aria-label":`${x?"Hide":"Show"} ${t.name}'s team (${i})`,className:p("absolute -bottom-3 left-1/2 z-10 flex h-6 -translate-x-1/2 cursor-pointer items-center gap-0.5 rounded-full border px-2 text-[11px] font-semibold shadow-[0_2px_6px_-2px_rgba(5,8,22,.25)] outline-none transition-colors focus-visible:ring-2 focus-visible:ring-primary/40",x?"border-border bg-raised text-muted hover:text-text":"border-transparent bg-[linear-gradient(135deg,var(--brand-1),var(--brand-2))] text-white"),children:[e("span",{className:"num",children:i}),e(H,{className:p("size-3 transition-transform duration-200",x&&"rotate-180")})]}):null,g=c?()=>c(t):void 0,f=c?"button":"div",o=c?{type:"button",onClick:g}:{};let y;if(d==="avatar")y=s("div",{className:"relative flex w-36 flex-col items-center pb-4 text-center",children:[e(f,{...o,className:p("relative rounded-full outline-none focus-visible:ring-2 focus-visible:ring-primary/50",c&&"cursor-pointer"),children:e("span",{className:p("block rounded-full p-[3px] transition-shadow",m&&"shadow-[0_0_0_4px_var(--primary-subtle)]"),style:{background:`conic-gradient(from 210deg, ${n}, color-mix(in srgb, ${n} 30%, transparent), ${n})`},children:e("span",{className:"block rounded-full bg-raised p-[3px]",children:e(C,{name:t.name,src:t.avatar,size:"xl"})})})}),e("p",{className:"mt-2 text-[13.5px] font-semibold leading-5 text-text",children:t.name}),t.title?e("p",{className:"text-[11.5px] leading-4 text-muted",children:t.title}):null,t.badge?e("div",{className:"mt-1.5",children:t.badge}):null,v]});else if(d==="compact")y=s("div",{className:"relative pb-3",children:[s(f,{...o,className:p("flex h-10 max-w-[200px] items-center gap-2 rounded-full border bg-raised pl-1.5 pr-3.5 text-left shadow-[var(--lit),0_1px_2px_rgba(5,8,22,.06)] outline-none transition-[border-color,box-shadow] focus-visible:ring-2 focus-visible:ring-primary/40",m?"border-primary shadow-[0_0_0_3px_var(--primary-subtle)]":"border-border hover:border-border2",c&&"cursor-pointer"),children:[e(C,{name:t.name,src:t.avatar,size:"md"}),s("span",{className:"min-w-0",children:[e("span",{className:"block truncate text-[12.5px] font-semibold leading-4 text-text",children:t.name}),t.title?e("span",{className:"block truncate text-[10.5px] leading-[14px] text-muted",children:t.title}):null]}),e("span",{className:"ml-1 size-2 shrink-0 rounded-full",style:{background:n}})]}),v]});else{const l=d==="gradient"&&u===0;y=s("div",{className:"relative pb-3",children:[s(f,{...o,className:p("relative flex w-[212px] flex-col overflow-hidden rounded-[calc(14px*var(--radius-scale))] border text-left outline-none transition-[border-color,box-shadow,transform] duration-200 focus-visible:ring-2 focus-visible:ring-primary/40",l?"border-transparent bg-[linear-gradient(140deg,var(--brand-1),color-mix(in_srgb,var(--brand-1)_78%,#000)_45%,var(--brand-2))] text-white shadow-[inset_0_1px_0_rgba(255,255,255,.25),0_16px_34px_-16px_var(--brand-1)] [--text:#fff] [--muted:rgba(255,255,255,.75)]":"border-border bg-raised shadow-[var(--lit),0_1px_2px_rgba(5,8,22,.05),0_8px_20px_-14px_rgba(5,8,22,.25)]",m&&!l&&"border-primary shadow-[0_0_0_3px_var(--primary-subtle),0_10px_24px_-14px_color-mix(in_srgb,var(--primary)_60%,transparent)]",c&&"cursor-pointer hover:-translate-y-0.5"),children:[l?null:e("span",{"aria-hidden":!0,className:"h-[3px] w-full",style:{background:d==="gradient"?`linear-gradient(90deg, ${n}, color-mix(in srgb, ${n} 40%, transparent))`:n}}),s("span",{className:"flex items-center gap-3 p-3",children:[e("span",{className:p("rounded-full",l?"ring-2 ring-white/40":""),style:l?void 0:{boxShadow:`0 0 0 2px var(--raised), 0 0 0 3.5px color-mix(in srgb, ${n} 55%, transparent)`},children:e(C,{name:t.name,src:t.avatar,size:"lg"})}),s("span",{className:"min-w-0 flex-1",children:[s("span",{className:"flex items-center gap-1.5",children:[e("span",{className:"truncate text-[13.5px] font-semibold text-text",children:t.name}),t.badge]}),t.title?e("span",{className:"block truncate text-[12px] text-muted",children:t.title}):null]})]}),t.department?s("span",{className:p("mx-3 mb-3 inline-flex w-fit items-center gap-1.5 rounded-full px-2 py-0.5 text-[10.5px] font-semibold",l?"bg-white/15 text-white":""),style:l?void 0:{background:`color-mix(in srgb, ${n} 12%, transparent)`,color:n},children:[e("span",{className:"size-1.5 rounded-full",style:{background:l?"#fff":n}}),t.department]}):null]}),v]})}return s("li",{children:[y,x?e("ul",{className:"animate-[wave-in_240ms_var(--ease)]",children:r.map(l=>e(P,{node:l,depth:u+1,variant:d,folded:h,toggle:w,tone:N,selected:k,onSelect:c},l.id))}):null]})}function U({data:t,folded:u,toggle:d,tone:h,selected:w,onSelect:N,className:k}){const c=(r,x)=>{const n=r.children??[],m=n.length>0&&!u.has(r.id),i=w===r.id;return s("li",{children:[s("div",{className:p("group/row flex items-center gap-2.5 rounded-[calc(10px*var(--radius-scale))] py-1.5 pr-2 transition-colors",i?"bg-primary-subtle":"hover:bg-hover"),style:{paddingLeft:6+x*22},children:[n.length?e("button",{type:"button","aria-expanded":m,"aria-label":`${m?"Hide":"Show"} ${r.name}'s team`,onClick:()=>d(r.id),className:"grid size-6 shrink-0 cursor-pointer place-items-center rounded-[6px] text-muted hover:bg-border/60 hover:text-text",children:e(L,{className:p("size-3.5 transition-transform duration-200",m&&"rotate-90")})}):e("span",{className:"size-6 shrink-0"}),s("button",{type:"button",onClick:N?()=>N(r):void 0,className:p("flex min-w-0 flex-1 items-center gap-2.5 text-left outline-none",N&&"cursor-pointer"),children:[e("span",{className:"rounded-full",style:{boxShadow:`0 0 0 2px var(--canvas), 0 0 0 3.5px color-mix(in srgb, ${h(r)} 60%, transparent)`},children:e(C,{name:r.name,src:r.avatar,size:"md"})}),s("span",{className:"min-w-0 flex-1",children:[s("span",{className:"flex items-center gap-1.5",children:[e("span",{className:p("truncate text-[13px] font-semibold",i?"text-primary":"text-text"),children:r.name}),r.badge]}),e("span",{className:"block truncate text-[11.5px] text-muted",children:[r.title,r.department].filter(Boolean).join(" \xB7 ")})]})]}),n.length?e("span",{className:"num shrink-0 rounded-full bg-hover px-2 py-px text-[11px] font-medium text-muted group-hover/row:bg-raised",children:S(r)}):null]}),m?s("ul",{className:"relative animate-[wave-in_200ms_var(--ease)]",children:[e("span",{"aria-hidden":!0,className:"absolute bottom-3 top-0 w-px bg-border",style:{left:18+x*22}}),n.map(v=>c(v,x+1))]}):null]},r.id)};return e("ul",{className:p("space-y-px",k),children:c(t,0)})}const j=T;export{Z as OrgChart,j as orgIds};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as e,jsxs as
|
|
1
|
+
import{jsx as e,jsxs as n}from"react/jsx-runtime";import{CircleAlert as p,CircleCheck as x,Info as u,Sparkles as g,TriangleAlert as f}from"lucide-react";import{RouterLink as N}from"../../hooks/use-router.js";import{cn as s}from"../../lib/utils.js";function h({items:a}){return e("nav",{"aria-label":"Breadcrumb",className:"mb-3 text-xs text-muted",children:e("ol",{className:"flex flex-wrap items-center",children:a.map((r,t)=>n("li",{className:"flex items-center",children:[t>0?e("span",{className:"mx-1.5 text-border2","aria-hidden":!0,children:"\u203A"}):null,r.href&&t<a.length-1?e(N,{href:r.href,className:"text-primary hover:underline",children:r.label}):e("span",{"aria-current":t===a.length-1?"page":void 0,children:r.label})]},`${r.label}-${t}`))})})}function T({crumbs:a,title:r,description:t,secondary:o,primary:l,className:c}){return n("div",{className:s("mb-5",c),children:[a?.length?e(h,{items:a}):null,n("div",{className:"flex flex-col items-start gap-3 sm:flex-row sm:flex-wrap sm:gap-4",children:[n("div",{className:"min-w-0 w-full flex-1",children:[e("h1",{className:"disp text-2xl font-semibold leading-[30px]",children:r}),t?e("p",{className:"mt-1 max-w-[70ch] text-[13px] text-muted",children:t}):null]}),o||l?n("div",{className:"flex w-full shrink-0 items-center gap-2 sm:w-auto",children:[o,l]}):null]})]})}const v={accent:{soft:"border-accent bg-primary-subtle",outline:"border-accent/40",icon:g},info:{soft:"border-primary bg-primary-subtle",outline:"border-primary/40",icon:u},success:{soft:"border-success bg-success-subtle",outline:"border-success/40",icon:x},warning:{soft:"border-warning bg-warning-subtle",outline:"border-warning/40",icon:f},danger:{soft:"border-danger bg-danger-subtle",outline:"border-danger/40",icon:p},neutral:{soft:"border-border2 bg-hover",outline:"border-border2",icon:u}},w={accent:"text-accent",info:"text-primary",success:"text-success",warning:"text-warning",danger:"text-danger",neutral:"text-muted"};function C({children:a,className:r,tone:t="accent",title:o,icon:l,action:c,variant:i="soft"}){const d=v[t],b=d.icon,m=l===!0?e(b,{className:"size-4"}):l||null;return n("div",{className:s("mb-4 flex items-start gap-3 text-[13px] leading-5",i==="soft"&&s("rounded-r-ctl border-l-[3px] px-3.5 py-2.5 text-body",d.soft),i==="outline"&&s("rounded-ctl border bg-raised px-3.5 py-3 text-body",d.outline),i==="gradient"&&"rounded-[calc(12px*var(--radius-scale))] bg-[linear-gradient(135deg,var(--brand-1),var(--brand-2))] px-4 py-3 text-white/90 shadow-[inset_0_1px_0_rgba(255,255,255,.2),0_8px_20px_-10px_color-mix(in_srgb,var(--brand-1)_60%,transparent)]",r),children:[m?e("span",{className:s("mt-0.5 shrink-0 [&_svg]:size-4",i==="gradient"?"text-white":w[t]),children:m}):null,n("div",{className:"min-w-0 flex-1",children:[o?e("p",{className:s("mb-0.5 font-semibold",i==="gradient"?"text-white":"text-text"),children:o}):null,a]}),c?e("div",{className:"shrink-0 self-center",children:c}):null]})}export{h as Breadcrumbs,C as Note,T as PageHeader};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as t,jsxs as r}from"react/jsx-runtime";import{ChevronRight as v}from"lucide-react";import*as h from"react";import{cn as l}from"../../lib/utils.js";import{StatusBadge as N}from"../ui/badge.js";const y={neutral:"text-muted",info:"text-primary",success:"text-success",warning:"text-warning",danger:"text-danger",accent:"text-accent"};function T({crumbs:n,icon:
|
|
1
|
+
import{jsx as t,jsxs as r}from"react/jsx-runtime";import{ChevronRight as v}from"lucide-react";import*as h from"react";import{cn as l}from"../../lib/utils.js";import{StatusBadge as N}from"../ui/badge.js";const y={neutral:"text-muted",info:"text-primary",success:"text-success",warning:"text-warning",danger:"text-danger",accent:"text-accent"};function T({crumbs:n,icon:o,eyebrow:i,badge:s,title:b,description:d,meta:c,actions:p,stats:m,tabs:x,activeTab:u,onTabChange:g,className:f}){return r("header",{className:l("relative isolate overflow-hidden rounded-[calc(16px*var(--radius-scale))] border border-border bg-surface shadow-[var(--lit)]","before:absolute before:inset-0 before:-z-10 before:bg-[radial-gradient(80%_120%_at_100%_0%,var(--primary-subtle),transparent_55%)]","after:absolute after:inset-0 after:-z-10 after:bg-[radial-gradient(var(--border)_1px,transparent_1px)] after:[background-size:16px_16px] after:[mask-image:linear-gradient(135deg,transparent_35%,black_100%)] after:opacity-60",f),children:[r("div",{className:"px-5 pb-5 pt-4 sm:px-6",children:[n?.length?t("nav",{"aria-label":"Breadcrumb",className:"mb-3 flex flex-wrap items-center gap-1 text-[12px] text-muted",children:n.map((e,a)=>r(h.Fragment,{children:[a>0?t(v,{className:"size-3 opacity-60"}):null,e.href&&a<n.length-1?t("a",{href:e.href,className:"rounded px-0.5 transition-colors hover:text-text",children:e.label}):t("span",{className:l(a===n.length-1&&"text-body"),children:e.label})]},`${e.label}-${a}`))}):null,r("div",{className:"flex flex-col gap-4 lg:flex-row lg:items-start lg:justify-between",children:[r("div",{className:"flex min-w-0 items-start gap-4",children:[o?t("span",{className:"grid size-14 shrink-0 place-items-center overflow-hidden rounded-[calc(14px*var(--radius-scale))] border border-border bg-raised text-primary shadow-elev2 [&>svg]:size-6",children:o}):null,r("div",{className:"min-w-0",children:[i?t("p",{className:"mb-1 text-[11px] font-semibold uppercase tracking-[0.1em] text-primary",children:i}):null,r("div",{className:"flex flex-wrap items-center gap-x-2.5 gap-y-1",children:[t("h1",{className:"disp text-[22px] font-semibold leading-tight tracking-[-0.01em] text-text sm:text-[26px]",children:b}),s?t(N,{label:s.label,tone:s.tone??"neutral"}):null]}),d?t("p",{className:"mt-1.5 max-w-[68ch] text-[13.5px] leading-relaxed text-muted",children:d}):null,c?.length?t("ul",{className:"mt-3 flex flex-wrap items-center gap-x-4 gap-y-1.5 text-[12.5px] text-body",children:c.map((e,a)=>r("li",{className:"flex items-center gap-1.5",children:[e.icon?t(e.icon,{className:"size-3.5 text-muted"}):null,e.label]},a))}):null]})]}),p?t("div",{className:"flex shrink-0 flex-wrap items-center gap-2",children:p}):null]}),m?.length?t("dl",{className:"mt-5 grid grid-cols-2 gap-px overflow-hidden rounded-[calc(12px*var(--radius-scale))] border border-border bg-border sm:grid-cols-4",children:m.map(e=>r("div",{className:"bg-raised/90 px-4 py-3 backdrop-blur",children:[t("dt",{className:"text-[11px] font-medium uppercase tracking-[0.06em] text-muted",children:e.label}),t("dd",{className:"num mt-1 text-[19px] font-semibold leading-none text-text",children:e.value}),e.hint?t("dd",{className:l("num mt-1 text-[11.5px]",y[e.tone??"neutral"]),children:e.hint}):null]},e.label))}):null]}),x?.length?t("nav",{role:"tablist",className:"flex gap-1 overflow-x-auto border-t border-border px-3 [scrollbar-width:none] sm:px-4",children:x.map(e=>{const a=e.id===u;return r("button",{type:"button",role:"tab","aria-selected":a,onClick:()=>g?.(e.id),className:l("relative flex h-11 shrink-0 cursor-pointer items-center gap-1.5 px-3 text-[13px] font-medium transition-colors",a?"text-text":"text-muted hover:text-text","after:absolute after:inset-x-2 after:bottom-0 after:h-[2px] after:rounded-full after:transition-colors",a?"after:bg-primary":"after:bg-transparent"),children:[e.label,e.count!==void 0?t("span",{className:l("num rounded-full px-1.5 py-px text-[10.5px]",a?"bg-primary-subtle text-primary":"bg-hover text-muted"),children:e.count}):null]},e.id)})}):null]})}export{T as PageHero};
|