@nqlib/nqui 0.4.2 → 0.4.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +104 -152
- package/dist/button-CJHdCq9I.js +155 -0
- package/dist/button-R304rhsj.cjs +1 -0
- package/dist/calendar.cjs.js +1 -1
- package/dist/calendar.es.js +1 -1
- package/dist/carousel-D1FMVglR.cjs +1 -0
- package/dist/carousel-U7RZhYZj.js +179 -0
- package/dist/carousel.cjs.js +1 -1
- package/dist/carousel.es.js +1 -1
- package/dist/{command-palette-dEJ9aEk4.js → command-palette-DCtLpM3Q.js} +1 -1
- package/dist/{command-palette-BuYcxPCc.cjs → command-palette-MHc03bBf.cjs} +1 -1
- package/dist/command.cjs.js +1 -1
- package/dist/command.es.js +1 -1
- package/dist/components/custom/color-picker.d.ts +1 -1
- package/dist/components/custom/color-picker.d.ts.map +1 -1
- package/dist/components/custom/color-slider.d.ts +4 -10
- package/dist/components/custom/color-slider.d.ts.map +1 -1
- package/dist/components/debug/debug-features.d.ts +29 -0
- package/dist/components/debug/debug-features.d.ts.map +1 -0
- package/dist/components/debug/debug-panel.d.ts.map +1 -1
- package/dist/components/index.d.ts +14 -13
- package/dist/components/index.d.ts.map +1 -1
- package/dist/components/ui/badge.d.ts +15 -4
- package/dist/components/ui/badge.d.ts.map +1 -1
- package/dist/components/ui/button.d.ts +37 -3
- package/dist/components/ui/button.d.ts.map +1 -1
- package/dist/components/ui/checkbox.d.ts +12 -1
- package/dist/components/ui/checkbox.d.ts.map +1 -1
- package/dist/components/ui/combobox.d.ts +2 -1
- package/dist/components/ui/combobox.d.ts.map +1 -1
- package/dist/components/ui/pagination.d.ts +3 -2
- package/dist/components/ui/pagination.d.ts.map +1 -1
- package/dist/components/ui/select.d.ts +6 -1
- package/dist/components/ui/select.d.ts.map +1 -1
- package/dist/components/ui/sidebar.d.ts +1 -1
- package/dist/components/ui/sidebar.d.ts.map +1 -1
- package/dist/components/ui/slider.d.ts +10 -2
- package/dist/components/ui/slider.d.ts.map +1 -1
- package/dist/components/ui/sonner.d.ts +18 -2
- package/dist/components/ui/sonner.d.ts.map +1 -1
- package/dist/components/ui/spinner.d.ts +2 -1
- package/dist/components/ui/spinner.d.ts.map +1 -1
- package/dist/components/ui/switch.d.ts +15 -2
- package/dist/components/ui/switch.d.ts.map +1 -1
- package/dist/components/ui/tabs.d.ts +1 -1
- package/dist/components/ui/tabs.d.ts.map +1 -1
- package/dist/components/ui/toggle.d.ts +1 -1
- package/dist/components/ui/toggle.d.ts.map +1 -1
- package/dist/{debug-panel-AjzBdMMz.js → debug-panel-CG-vAN0L.js} +3593 -3775
- package/dist/debug-panel-DHBfAc1V.cjs +75 -0
- package/dist/debug.cjs.js +1 -1
- package/dist/debug.es.js +1 -1
- package/dist/{drawer-pUXPg3lF.js → drawer-DO26uhym.js} +31 -31
- package/dist/drawer-DVarEy65.cjs +1 -0
- package/dist/drawer.cjs.js +1 -1
- package/dist/drawer.es.js +1 -1
- package/dist/{enhanced-calendar-BENbxw7_.js → enhanced-calendar-BGlsSYJd.js} +1 -1
- package/dist/{enhanced-calendar-5PA8CeF7.cjs → enhanced-calendar-C7EQIr6i.cjs} +1 -1
- package/dist/entries/sonner.d.ts +1 -2
- package/dist/entries/sonner.d.ts.map +1 -1
- package/dist/lib/wrap-inline-label-text.d.ts +7 -0
- package/dist/lib/wrap-inline-label-text.d.ts.map +1 -0
- package/dist/nqui.cjs.js +21 -47
- package/dist/nqui.es.js +2236 -2381
- package/dist/sonner-CpmECDBk.js +179 -0
- package/dist/sonner-nE9hIalJ.cjs +48 -0
- package/dist/sonner.cjs.js +1 -1
- package/dist/sonner.es.js +3 -2
- package/dist/styles.css +183 -1
- package/docs/components/README.md +8 -7
- package/docs/components/nqui-badge.md +1 -0
- package/docs/components/nqui-button.md +3 -1
- package/docs/components/nqui-card.md +1 -0
- package/docs/components/nqui-carousel.md +6 -0
- package/docs/components/nqui-checkbox.md +15 -0
- package/docs/components/nqui-color-slider.md +5 -3
- package/docs/components/nqui-combobox.md +58 -37
- package/docs/components/nqui-drawer.md +1 -1
- package/docs/components/nqui-scroll-area.md +1 -1
- package/docs/components/nqui-select.md +2 -2
- package/docs/components/nqui-sheet.md +1 -1
- package/docs/components/nqui-slider.md +13 -0
- package/docs/components/nqui-spinner.md +6 -1
- package/docs/components/nqui-switch.md +23 -1
- package/docs/components/nqui-toaster.md +5 -1
- package/docs/nqui-skills/SKILL.md +8 -1
- package/docs/nqui-skills/design-system.md +16 -3
- package/package.json +1 -1
- package/scripts/build-styles.js +16 -0
- package/scripts/init-debug-css.js +4 -2
- package/scripts/verify-build.js +1 -1
- package/dist/button-CYFTFDKe.cjs +0 -1
- package/dist/button-nJvDl3w8.js +0 -44
- package/dist/carousel-DEyyJi49.js +0 -179
- package/dist/carousel-Dhhz8m5V.cjs +0 -1
- package/dist/components/custom/enhanced-badge.d.ts +0 -33
- package/dist/components/custom/enhanced-badge.d.ts.map +0 -1
- package/dist/components/custom/enhanced-button.d.ts +0 -39
- package/dist/components/custom/enhanced-button.d.ts.map +0 -1
- package/dist/components/custom/enhanced-checkbox.d.ts +0 -39
- package/dist/components/custom/enhanced-checkbox.d.ts.map +0 -1
- package/dist/components/custom/enhanced-combobox.d.ts +0 -35
- package/dist/components/custom/enhanced-combobox.d.ts.map +0 -1
- package/dist/components/custom/enhanced-select.d.ts +0 -30
- package/dist/components/custom/enhanced-select.d.ts.map +0 -1
- package/dist/components/custom/enhanced-sonner.d.ts +0 -15
- package/dist/components/custom/enhanced-sonner.d.ts.map +0 -1
- package/dist/debug-panel-NaOmD68t.cjs +0 -171
- package/dist/drawer-Cqq0Ozb2.cjs +0 -1
- package/dist/sonner-BtzU00r3.js +0 -248
- package/dist/sonner-Dfk26eds.cjs +0 -54
package/README.md
CHANGED
|
@@ -10,43 +10,88 @@ A React component library with enhanced UI components and developer tools. Built
|
|
|
10
10
|
|
|
11
11
|
## Installation
|
|
12
12
|
|
|
13
|
-
Install
|
|
13
|
+
### Install the package
|
|
14
|
+
|
|
15
|
+
Install the published package from [npm](https://www.npmjs.com/package/@nqlib/nqui):
|
|
14
16
|
|
|
15
17
|
```bash
|
|
16
18
|
npm install @nqlib/nqui @hugeicons/react @hugeicons/core-free-icons
|
|
17
19
|
```
|
|
18
20
|
|
|
19
|
-
Hugeicons is required for
|
|
21
|
+
Hugeicons is required for icons in components (Button, Accordion, Select, etc.).
|
|
20
22
|
|
|
21
|
-
**
|
|
23
|
+
**All optional peers** (Sortable, Carousel, DataTable, Calendar, etc.):
|
|
22
24
|
|
|
23
25
|
```bash
|
|
24
26
|
npx @nqlib/nqui install-peers
|
|
25
27
|
```
|
|
26
28
|
|
|
27
|
-
**After install
|
|
28
|
-
|
|
29
|
+
**After `npm install`:** the post-install script may add a `nqui:init` script and write initial Cursor rules under `.cursor/`. It does **not** copy full **nqui-skills** or set up CSS — run the commands below. Run `npx nqui-setup` (same as `npx @nqlib/nqui setup`) anytime to see next steps again. Post-install is skipped when `CI=true` or `CI=1`.
|
|
30
|
+
|
|
31
|
+
### IDE skills (Cursor and compatible agents)
|
|
32
|
+
|
|
33
|
+
Copy the library’s **skills** into your app so your IDE can follow nqui patterns (components, design system, ToggleGroup rules, etc.):
|
|
34
|
+
|
|
35
|
+
| Command | What it does |
|
|
36
|
+
|--------|----------------|
|
|
37
|
+
| `npx @nqlib/nqui init-cursor` | Writes `.cursor/rules` and `.cursor/skills`, copies **`docs/nqui-skills`** → **`.cursor/nqui-skills`**, and creates **`AGENTS.md`** at the project root pointing agents at `.cursor/nqui-skills/SKILL.md`. |
|
|
38
|
+
| `npx @nqlib/nqui init-skills` | **Skills only:** copies nqui-skills to `.cursor/nqui-skills/` and (re)creates `AGENTS.md`. Use `--force` to overwrite existing files. |
|
|
39
|
+
| `npm run nqui:init` | **One-shot** (if post-install added this script): `install-peers` → `init-cursor` → `init-skills` → `init-css --sidebar --force`. You still add the CSS import to your main stylesheet (see [INSTALLATION.md](./INSTALLATION.md)). |
|
|
40
|
+
|
|
41
|
+
After copying skills, **restart the IDE** so rules and skills reload.
|
|
42
|
+
|
|
43
|
+
**Monorepos:** rules and skills are written to the workspace package that depends on `@nqlib/nqui`. Open that folder in your IDE so paths resolve.
|
|
44
|
+
|
|
45
|
+
---
|
|
29
46
|
|
|
30
|
-
|
|
47
|
+
### CLI commands
|
|
48
|
+
|
|
49
|
+
Run from your **app project root** (where `package.json` lives). Equivalent **global bins** (when the package is installed): `nqui`, `nqui-setup`, `nqui-install-peers`, `nqui-init-cursor`, `nqui-init-skills`, `nqui-init-css`, `nqui-init-debug`.
|
|
50
|
+
|
|
51
|
+
| Command | Description |
|
|
52
|
+
|--------|-------------|
|
|
53
|
+
| `npx @nqlib/nqui setup` | Re-run post-install: next steps + Cursor rules (not full skills/CSS). Same as `npx nqui-setup`. |
|
|
54
|
+
| `npx @nqlib/nqui install-peers` | Install `@nqlib/nqui` and required + optional peer dependencies. |
|
|
55
|
+
| `npx @nqlib/nqui init-cursor` | Cursor rules + **nqui-skills** → `.cursor/nqui-skills/` + `AGENTS.md`. |
|
|
56
|
+
| `npx @nqlib/nqui init-skills` | Copy nqui-skills only; `--force` to overwrite. |
|
|
57
|
+
| `npx @nqlib/nqui init-css` | Detect framework; create `nqui/index.css` and `nqui/nqui-setup.css`. Flags: `--sidebar`, `--force`, `--wizard`. Optional output path, e.g. `npx @nqlib/nqui init-css app/styles/nqui.css`. |
|
|
58
|
+
| `npx @nqlib/nqui` | No args → same as **init-css** (default `nqui/index.css`). |
|
|
59
|
+
| `npx @nqlib/nqui init-debug` or `init-debug-css` | Scaffold CSS for `DebugPanel`. |
|
|
60
|
+
|
|
61
|
+
---
|
|
62
|
+
|
|
63
|
+
### Recommended setup order
|
|
64
|
+
|
|
65
|
+
**Option A — one command** (if `nqui:init` exists in `package.json`):
|
|
31
66
|
|
|
32
67
|
```bash
|
|
33
|
-
|
|
34
|
-
|
|
68
|
+
npm run nqui:init
|
|
69
|
+
```
|
|
70
|
+
|
|
71
|
+
Then add `@import "@nqlib/nqui/styles";` (or your framework’s full CSS snippet) to your main CSS — see [INSTALLATION.md](./INSTALLATION.md) Step 2.
|
|
35
72
|
|
|
36
|
-
|
|
37
|
-
npm login --registry=https://npm.pkg.github.com
|
|
73
|
+
**Option B — step by step:**
|
|
38
74
|
|
|
39
|
-
|
|
75
|
+
```bash
|
|
40
76
|
npm install @nqlib/nqui @hugeicons/react @hugeicons/core-free-icons
|
|
77
|
+
# optional: npx @nqlib/nqui install-peers
|
|
78
|
+
|
|
79
|
+
npx @nqlib/nqui init-cursor
|
|
80
|
+
# optional refresh: npx @nqlib/nqui init-skills
|
|
81
|
+
|
|
82
|
+
npx @nqlib/nqui init-css --sidebar
|
|
83
|
+
# add CSS import to app/globals.css or src/index.css — see INSTALLATION.md
|
|
41
84
|
```
|
|
42
85
|
|
|
86
|
+
**Detailed CSS paths, Next.js `@source` lines, and troubleshooting:** [INSTALLATION.md](./INSTALLATION.md).
|
|
87
|
+
|
|
43
88
|
## Quick Start
|
|
44
89
|
|
|
45
|
-
### Option 1: Package
|
|
90
|
+
### Option 1: Package import (recommended)
|
|
46
91
|
|
|
47
|
-
####
|
|
92
|
+
#### Next.js
|
|
48
93
|
|
|
49
|
-
1. **Import CSS in
|
|
94
|
+
1. **Import CSS** in `app/globals.css` (or equivalent):
|
|
50
95
|
|
|
51
96
|
```tsx
|
|
52
97
|
// app/globals.css
|
|
@@ -72,9 +117,10 @@ export default function Page() {
|
|
|
72
117
|
}
|
|
73
118
|
```
|
|
74
119
|
|
|
75
|
-
|
|
120
|
+
Pages using nqui must use `"use client"` where required (hooks).
|
|
121
|
+
|
|
122
|
+
**Local linking:** with `npm link` or `file:`, you may need Webpack instead of Turbopack:
|
|
76
123
|
|
|
77
|
-
**For Local Development:** If you're using `npm link` or `file:` protocol, you may need to use Webpack instead of Turbopack:
|
|
78
124
|
```json
|
|
79
125
|
{
|
|
80
126
|
"scripts": {
|
|
@@ -82,22 +128,22 @@ export default function Page() {
|
|
|
82
128
|
}
|
|
83
129
|
}
|
|
84
130
|
```
|
|
85
|
-
See [Troubleshooting](#troubleshooting) for more details.
|
|
86
131
|
|
|
87
|
-
|
|
132
|
+
See [Troubleshooting](#troubleshooting).
|
|
133
|
+
|
|
134
|
+
#### Vite
|
|
88
135
|
|
|
89
|
-
1. **
|
|
136
|
+
1. **CSS** in `src/index.css`:
|
|
90
137
|
|
|
91
138
|
```css
|
|
92
|
-
/* src/index.css */
|
|
93
139
|
@import "tailwindcss";
|
|
94
140
|
@import "tw-animate-css";
|
|
95
141
|
@import "@nqlib/nqui/styles";
|
|
96
142
|
```
|
|
97
143
|
|
|
98
|
-
|
|
144
|
+
Vite with `@tailwindcss/vite` does not need the same `@source` directives as Next.js.
|
|
99
145
|
|
|
100
|
-
2. **
|
|
146
|
+
2. **Components:**
|
|
101
147
|
|
|
102
148
|
```tsx
|
|
103
149
|
import { Button } from '@nqlib/nqui';
|
|
@@ -107,43 +153,30 @@ function App() {
|
|
|
107
153
|
}
|
|
108
154
|
```
|
|
109
155
|
|
|
110
|
-
### Option 2:
|
|
111
|
-
|
|
112
|
-
The init script automatically detects your framework and sets up CSS with framework-specific Tailwind directives:
|
|
156
|
+
### Option 2: `init-css` helper
|
|
113
157
|
|
|
114
158
|
```bash
|
|
115
159
|
npx @nqlib/nqui init-css
|
|
116
160
|
```
|
|
117
161
|
|
|
118
|
-
|
|
119
|
-
- Detect your framework (Next.js, Vite, Remix, etc.)
|
|
120
|
-
- Add framework-specific Tailwind setup
|
|
121
|
-
- Copy nqui CSS variables to the appropriate location
|
|
122
|
-
- Provide next steps
|
|
123
|
-
|
|
124
|
-
**For Next.js:** Creates/updates `app/globals.css` with Next.js-specific directives
|
|
125
|
-
**For Vite:** Creates/updates `src/index.css` with Vite-specific directives
|
|
162
|
+
Detects Next.js, Vite, Remix, etc., and scaffolds CSS entry files; see [INSTALLATION.md](./INSTALLATION.md) for wiring the import into your main stylesheet.
|
|
126
163
|
|
|
127
|
-
## Setup
|
|
164
|
+
## Setup requirements
|
|
128
165
|
|
|
129
|
-
### Tailwind CSS
|
|
166
|
+
### Tailwind CSS
|
|
130
167
|
|
|
131
|
-
nqui
|
|
168
|
+
nqui expects Tailwind CSS v4:
|
|
132
169
|
|
|
133
170
|
```bash
|
|
134
171
|
npm install tailwindcss@^4.1.0
|
|
135
172
|
```
|
|
136
173
|
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
For **Vite**, install the Tailwind CSS Vite plugin:
|
|
174
|
+
**Vite** — add the plugin:
|
|
140
175
|
|
|
141
176
|
```bash
|
|
142
177
|
npm install @tailwindcss/vite
|
|
143
178
|
```
|
|
144
179
|
|
|
145
|
-
Then add it to your `vite.config.ts`:
|
|
146
|
-
|
|
147
180
|
```ts
|
|
148
181
|
import tailwindcss from '@tailwindcss/vite';
|
|
149
182
|
import { defineConfig } from 'vite';
|
|
@@ -153,16 +186,12 @@ export default defineConfig({
|
|
|
153
186
|
});
|
|
154
187
|
```
|
|
155
188
|
|
|
156
|
-
### Optional:
|
|
157
|
-
|
|
158
|
-
If you want to use the debug tools in development:
|
|
189
|
+
### Optional: debug tools
|
|
159
190
|
|
|
160
191
|
```bash
|
|
161
192
|
npx @nqlib/nqui init-debug-css
|
|
162
193
|
```
|
|
163
194
|
|
|
164
|
-
Then import in your app:
|
|
165
|
-
|
|
166
195
|
```tsx
|
|
167
196
|
import { DebugPanel } from '@nqlib/nqui';
|
|
168
197
|
import '@nqlib/nqui/debug.css';
|
|
@@ -177,16 +206,11 @@ function App() {
|
|
|
177
206
|
}
|
|
178
207
|
```
|
|
179
208
|
|
|
180
|
-
## Component
|
|
181
|
-
|
|
182
|
-
Per-component implementation guides (AI/LLM-optimized) are in `docs/components/`:
|
|
183
|
-
- After install: `node_modules/@nqlib/nqui/docs/components/README.md` (index of all components)
|
|
184
|
-
- Each file: `nqui-<component>.md` — import, variants, props, notes
|
|
185
|
-
- Token-optimized for easy AI consumption and implementation
|
|
209
|
+
## Component instructions
|
|
186
210
|
|
|
187
|
-
|
|
211
|
+
Guides for each component live under `docs/components/` in the package (after install: `node_modules/@nqlib/nqui/docs/components/`). Use **`npx @nqlib/nqui init-skills`** (or `init-cursor`) so your IDE loads `.cursor/nqui-skills` and `AGENTS.md`.
|
|
188
212
|
|
|
189
|
-
###
|
|
213
|
+
### Examples
|
|
190
214
|
|
|
191
215
|
```tsx
|
|
192
216
|
import { Button, Checkbox, Input } from '@nqlib/nqui';
|
|
@@ -199,13 +223,8 @@ function MyForm() {
|
|
|
199
223
|
<Button variant="default">Submit</Button>
|
|
200
224
|
</form>
|
|
201
225
|
);
|
|
202
|
-
}
|
|
203
226
|
```
|
|
204
227
|
|
|
205
|
-
### Enhanced Components
|
|
206
|
-
|
|
207
|
-
nqui includes enhanced versions of common components with additional variants:
|
|
208
|
-
|
|
209
228
|
```tsx
|
|
210
229
|
import { Button, Separator } from '@nqlib/nqui';
|
|
211
230
|
|
|
@@ -221,8 +240,6 @@ function MyComponent() {
|
|
|
221
240
|
}
|
|
222
241
|
```
|
|
223
242
|
|
|
224
|
-
### Custom Components
|
|
225
|
-
|
|
226
243
|
```tsx
|
|
227
244
|
import { ColorPicker, Rating, TableOfContents } from '@nqlib/nqui';
|
|
228
245
|
|
|
@@ -237,48 +254,26 @@ function MyApp() {
|
|
|
237
254
|
}
|
|
238
255
|
```
|
|
239
256
|
|
|
240
|
-
## Framework
|
|
257
|
+
## Framework support
|
|
241
258
|
|
|
242
|
-
-
|
|
243
|
-
-
|
|
244
|
-
-
|
|
245
|
-
-
|
|
259
|
+
- **Next.js** (App Router)
|
|
260
|
+
- **Vite**
|
|
261
|
+
- **Remix**
|
|
262
|
+
- **Create React App**
|
|
246
263
|
|
|
247
|
-
|
|
264
|
+
Components are framework-agnostic for any React setup.
|
|
248
265
|
|
|
249
266
|
## Troubleshooting
|
|
250
267
|
|
|
251
|
-
###
|
|
252
|
-
|
|
253
|
-
**Problem:** Tailwind classes not working, or confusion about whether to use `@source` directives
|
|
254
|
-
|
|
255
|
-
**Solution:**
|
|
256
|
-
- **Next.js REQUIRES `@source` directives** in your CSS file:
|
|
257
|
-
```css
|
|
258
|
-
@import "tailwindcss";
|
|
259
|
-
@source "./**/*.{js,ts,jsx,tsx,mdx}";
|
|
260
|
-
@source "../components/**/*.{js,ts,jsx,tsx,mdx}";
|
|
261
|
-
@source "../node_modules/@nqlib/nqui/dist/**/*.js";
|
|
262
|
-
@import "tw-animate-css";
|
|
263
|
-
@import "@nqlib/nqui/styles";
|
|
264
|
-
```
|
|
265
|
-
|
|
266
|
-
- **Vite does NOT need `@source` directives** - Tailwind automatically scans files:
|
|
267
|
-
```css
|
|
268
|
-
@import "tailwindcss";
|
|
269
|
-
@import "tw-animate-css";
|
|
270
|
-
@import "@nqlib/nqui/styles";
|
|
271
|
-
```
|
|
268
|
+
### `@source`: Next.js vs Vite
|
|
272
269
|
|
|
273
|
-
**
|
|
270
|
+
- **Next.js** needs `@source` lines so Tailwind sees app and `node_modules/@nqlib/nqui` — see the Quick Start block above.
|
|
271
|
+
- **Vite** typically does not need those `@source` lines when using `@tailwindcss/vite`.
|
|
274
272
|
|
|
275
|
-
|
|
273
|
+
### Module resolution (Next.js 16+, local packages)
|
|
276
274
|
|
|
277
|
-
|
|
275
|
+
If `@nqlib/nqui` fails to resolve with `npm link` / `file:`:
|
|
278
276
|
|
|
279
|
-
If you encounter `Module not found: Can't resolve '@nqlib/nqui'` when using `npm link` or `file:` protocol, switch to Webpack:
|
|
280
|
-
|
|
281
|
-
**Quick Fix:**
|
|
282
277
|
```json
|
|
283
278
|
{
|
|
284
279
|
"scripts": {
|
|
@@ -287,79 +282,36 @@ If you encounter `Module not found: Can't resolve '@nqlib/nqui'` when using `npm
|
|
|
287
282
|
}
|
|
288
283
|
```
|
|
289
284
|
|
|
290
|
-
|
|
291
|
-
```typescript
|
|
292
|
-
const nextConfig: NextConfig = {
|
|
293
|
-
experimental: {
|
|
294
|
-
turbo: undefined, // Disable Turbopack
|
|
295
|
-
},
|
|
296
|
-
};
|
|
297
|
-
```
|
|
298
|
-
|
|
299
|
-
**Why?** Next.js 16 uses Turbopack by default, which has limited symlink support. Webpack handles symlinks better for local development. Production builds always use Webpack, so there's no production impact.
|
|
285
|
+
Production builds use Webpack; this mainly affects local dev with symlinks.
|
|
300
286
|
|
|
301
|
-
|
|
287
|
+
More tips: [instructions.md](./instructions.md).
|
|
302
288
|
|
|
303
289
|
## Features
|
|
304
290
|
|
|
305
|
-
-
|
|
306
|
-
-
|
|
307
|
-
-
|
|
308
|
-
-
|
|
309
|
-
-
|
|
310
|
-
-
|
|
311
|
-
-
|
|
291
|
+
- **UI components** — Buttons, forms, layout, data display, overlays, with consistent variants
|
|
292
|
+
- **Custom components** — e.g. ColorPicker, Rating, TableOfContents
|
|
293
|
+
- **Debug tools** — optional `DebugPanel` in development
|
|
294
|
+
- **TypeScript** — exported types
|
|
295
|
+
- **Accessible** — Radix UI primitives
|
|
296
|
+
- **Theming** — CSS variables
|
|
297
|
+
- **Tree-shakeable** — import only what you use
|
|
312
298
|
|
|
313
299
|
## Documentation
|
|
314
300
|
|
|
315
|
-
- [
|
|
316
|
-
- [Debug
|
|
317
|
-
- [
|
|
318
|
-
|
|
319
|
-
## Development
|
|
301
|
+
- [INSTALLATION.md](./INSTALLATION.md) — CSS setup, CLI details, monorepos
|
|
302
|
+
- [Debug tools](./src/components/debug/README.md) — debug panel
|
|
303
|
+
- [CHANGELOG.md](./CHANGELOG.md) — release history
|
|
320
304
|
|
|
321
|
-
|
|
305
|
+
## Publishing (maintainers)
|
|
322
306
|
|
|
323
|
-
```bash
|
|
324
|
-
# Install dependencies
|
|
325
|
-
npm install
|
|
326
|
-
|
|
327
|
-
# Run dev server (showcase app)
|
|
328
|
-
npm run dev
|
|
329
|
-
|
|
330
|
-
# Build library
|
|
331
|
-
npm run build:lib
|
|
332
|
-
|
|
333
|
-
# Build showcase app
|
|
334
|
-
npm run build:app
|
|
335
|
-
|
|
336
|
-
# Lint
|
|
337
|
-
npm run lint
|
|
338
|
-
```
|
|
339
|
-
|
|
340
|
-
## Publishing
|
|
341
|
-
|
|
342
|
-
For maintainers:
|
|
343
|
-
|
|
344
|
-
**Publish to npmjs.com (recommended):**
|
|
345
307
|
```bash
|
|
346
308
|
npm version patch|minor|major
|
|
347
309
|
npm run publish:npm
|
|
348
310
|
```
|
|
349
311
|
|
|
350
|
-
|
|
351
|
-
```bash
|
|
352
|
-
npm version patch|minor|major
|
|
353
|
-
npm run publish:github
|
|
354
|
-
```
|
|
355
|
-
|
|
356
|
-
**Publish to both:**
|
|
357
|
-
```bash
|
|
358
|
-
npm version patch|minor|major
|
|
359
|
-
npm run publish:both
|
|
360
|
-
```
|
|
312
|
+
GitHub Packages: `npm run publish:github`. Both: `npm run publish:both`.
|
|
361
313
|
|
|
362
|
-
|
|
314
|
+
Details: [docs/internal-notes/PUBLISHING.md](./docs/internal-notes/PUBLISHING.md).
|
|
363
315
|
|
|
364
316
|
## License
|
|
365
317
|
|
|
@@ -0,0 +1,155 @@
|
|
|
1
|
+
import { jsx as i } from "react/jsx-runtime";
|
|
2
|
+
import * as o from "react";
|
|
3
|
+
import { Slot as u } from "@radix-ui/react-slot";
|
|
4
|
+
import { cva as b } from "class-variance-authority";
|
|
5
|
+
import { c as g } from "./utils-B6yFEsav.js";
|
|
6
|
+
function c(t) {
|
|
7
|
+
return o.Children.map(t, (e, r) => {
|
|
8
|
+
if (e === null || e === !1) return e;
|
|
9
|
+
if (typeof e == "string" || typeof e == "number")
|
|
10
|
+
return /* @__PURE__ */ i("span", { className: "min-w-0 shrink truncate", children: e }, `nqui-inline-lbl-${r}`);
|
|
11
|
+
if (o.isValidElement(e) && e.type === o.Fragment) {
|
|
12
|
+
const { children: n } = e.props;
|
|
13
|
+
return /* @__PURE__ */ i(o.Fragment, { children: c(n) }, `nqui-inline-fr-${r}`);
|
|
14
|
+
}
|
|
15
|
+
return e;
|
|
16
|
+
});
|
|
17
|
+
}
|
|
18
|
+
const h = b(
|
|
19
|
+
"inline-flex min-w-0 max-w-full items-center justify-center gap-2 whitespace-nowrap rounded-full text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
|
|
20
|
+
{
|
|
21
|
+
variants: {
|
|
22
|
+
variant: {
|
|
23
|
+
default: "bg-primary text-primary-foreground hover:bg-primary/90",
|
|
24
|
+
destructive: "bg-destructive text-destructive-foreground hover:bg-destructive/90",
|
|
25
|
+
outline: "border border-input bg-background hover:bg-accent hover:text-accent-foreground",
|
|
26
|
+
secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
|
|
27
|
+
ghost: "hover:bg-accent hover:text-accent-foreground",
|
|
28
|
+
link: "text-primary underline-offset-4 hover:underline"
|
|
29
|
+
},
|
|
30
|
+
size: {
|
|
31
|
+
default: "h-7 min-w-7 px-3",
|
|
32
|
+
sm: "h-6 min-w-6 px-2 text-xs",
|
|
33
|
+
lg: "h-8 min-w-8 px-4",
|
|
34
|
+
icon: "h-7 w-7 p-0"
|
|
35
|
+
}
|
|
36
|
+
},
|
|
37
|
+
defaultVariants: {
|
|
38
|
+
variant: "default",
|
|
39
|
+
size: "default"
|
|
40
|
+
}
|
|
41
|
+
}
|
|
42
|
+
), l = o.forwardRef(
|
|
43
|
+
({ className: t, variant: e, size: r, asChild: n = !1, children: s, ...a }, d) => /* @__PURE__ */ i(
|
|
44
|
+
n ? u : "button",
|
|
45
|
+
{
|
|
46
|
+
className: g(h({ variant: e, size: r, className: t })),
|
|
47
|
+
ref: d,
|
|
48
|
+
...a,
|
|
49
|
+
children: c(s)
|
|
50
|
+
}
|
|
51
|
+
)
|
|
52
|
+
);
|
|
53
|
+
l.displayName = "Button";
|
|
54
|
+
const m = b(
|
|
55
|
+
"inline-flex min-w-0 max-w-full items-center justify-center gap-2 whitespace-nowrap rounded-full text-sm font-medium leading-normal text-center cursor-pointer select-none touch-manipulation transition-[color,background-color,border-color,box-shadow,opacity,transform] duration-150 ease-in-out focus:outline-0 focus-visible:outline-0 disabled:pointer-events-none disabled:opacity-65 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
|
|
56
|
+
{
|
|
57
|
+
variants: {
|
|
58
|
+
variant: {
|
|
59
|
+
default: [
|
|
60
|
+
"bg-primary text-primary-foreground border border-primary",
|
|
61
|
+
"nqui-button-gradient nqui-button-shadow",
|
|
62
|
+
"opacity-90 hover:opacity-100",
|
|
63
|
+
"hover:bg-primary/90 hover:border-primary/90",
|
|
64
|
+
"focus:bg-primary/80 focus:border-primary/80",
|
|
65
|
+
"active:bg-primary/75 active:border-primary/75 active:shadow-[inset_0_3px_5px_rgba(0,0,0,0.125)] active:scale-95",
|
|
66
|
+
"disabled:bg-transparent disabled:shadow-none disabled:opacity-65"
|
|
67
|
+
],
|
|
68
|
+
destructive: [
|
|
69
|
+
"bg-destructive text-destructive-foreground border border-destructive",
|
|
70
|
+
"nqui-button-gradient nqui-button-shadow",
|
|
71
|
+
"opacity-90 hover:opacity-100",
|
|
72
|
+
"hover:bg-destructive/90 hover:border-destructive/90",
|
|
73
|
+
"focus:bg-destructive/80 focus:border-destructive/80",
|
|
74
|
+
"active:bg-destructive/75 active:border-destructive/75 active:shadow-[inset_0_3px_5px_rgba(0,0,0,0.125)] active:scale-95",
|
|
75
|
+
"disabled:bg-transparent disabled:shadow-none disabled:opacity-65"
|
|
76
|
+
],
|
|
77
|
+
secondary: [
|
|
78
|
+
"bg-secondary text-secondary-foreground border border-border",
|
|
79
|
+
"nqui-button-gradient nqui-button-shadow",
|
|
80
|
+
"opacity-90 hover:opacity-100",
|
|
81
|
+
"hover:bg-secondary/90 hover:border-border",
|
|
82
|
+
"focus:bg-secondary/80 focus:border-border",
|
|
83
|
+
"active:bg-secondary/75 active:border-border active:shadow-[inset_0_3px_5px_rgba(0,0,0,0.125)] active:scale-95",
|
|
84
|
+
"disabled:bg-transparent disabled:shadow-none disabled:opacity-65"
|
|
85
|
+
],
|
|
86
|
+
success: [
|
|
87
|
+
"bg-success text-success-foreground border border-success",
|
|
88
|
+
"nqui-button-gradient nqui-button-shadow",
|
|
89
|
+
"opacity-90 hover:opacity-100",
|
|
90
|
+
"hover:bg-success/90 hover:border-success/90",
|
|
91
|
+
"focus:bg-success/80 focus:border-success/80",
|
|
92
|
+
"active:bg-success/75 active:border-success/75 active:shadow-[inset_0_3px_5px_rgba(0,0,0,0.125)] active:scale-95",
|
|
93
|
+
"disabled:bg-transparent disabled:shadow-none disabled:opacity-65"
|
|
94
|
+
],
|
|
95
|
+
warning: [
|
|
96
|
+
"bg-warning text-warning-foreground border border-warning",
|
|
97
|
+
"nqui-button-gradient nqui-button-shadow",
|
|
98
|
+
"opacity-90 hover:opacity-100",
|
|
99
|
+
"hover:bg-warning/90 hover:border-warning/90",
|
|
100
|
+
"focus:bg-warning/80 focus:border-warning/80",
|
|
101
|
+
"active:bg-warning/75 active:border-warning/75 active:shadow-[inset_0_3px_5px_rgba(0,0,0,0.125)] active:scale-95",
|
|
102
|
+
"disabled:bg-transparent disabled:shadow-none disabled:opacity-65"
|
|
103
|
+
],
|
|
104
|
+
info: [
|
|
105
|
+
"bg-info text-info-foreground border border-info",
|
|
106
|
+
"nqui-button-gradient nqui-button-shadow",
|
|
107
|
+
"opacity-90 hover:opacity-100",
|
|
108
|
+
"hover:bg-info/90 hover:border-info/90",
|
|
109
|
+
"focus:bg-info/80 focus:border-info/80",
|
|
110
|
+
"active:bg-info/75 active:border-info/75 active:shadow-[inset_0_3px_5px_rgba(0,0,0,0.125)] active:scale-95",
|
|
111
|
+
"disabled:bg-transparent disabled:shadow-none disabled:opacity-65"
|
|
112
|
+
],
|
|
113
|
+
outline: "border border-input bg-background hover:bg-accent hover:text-accent-foreground",
|
|
114
|
+
ghost: "hover:bg-accent hover:text-accent-foreground",
|
|
115
|
+
link: "text-primary underline-offset-4 hover:underline"
|
|
116
|
+
},
|
|
117
|
+
size: {
|
|
118
|
+
default: "h-7 min-w-7 px-3",
|
|
119
|
+
sm: "h-6 min-w-6 px-2 text-xs",
|
|
120
|
+
lg: "h-8 min-w-8 px-4",
|
|
121
|
+
icon: "h-7 w-7 p-0"
|
|
122
|
+
}
|
|
123
|
+
},
|
|
124
|
+
defaultVariants: {
|
|
125
|
+
variant: "default",
|
|
126
|
+
size: "default"
|
|
127
|
+
}
|
|
128
|
+
}
|
|
129
|
+
), y = o.forwardRef(
|
|
130
|
+
({ className: t, variant: e, size: r, asChild: n = !1, children: s, ...a }, d) => {
|
|
131
|
+
if (!(e && ["default", "destructive", "secondary", "success", "warning", "info"].includes(e)) && e)
|
|
132
|
+
return /* @__PURE__ */ i(
|
|
133
|
+
l,
|
|
134
|
+
{
|
|
135
|
+
ref: d,
|
|
136
|
+
variant: e === "outline" || e === "ghost" || e === "link" ? e : "default",
|
|
137
|
+
size: r,
|
|
138
|
+
className: t,
|
|
139
|
+
asChild: n,
|
|
140
|
+
...a,
|
|
141
|
+
children: s
|
|
142
|
+
}
|
|
143
|
+
);
|
|
144
|
+
const p = n ? u : "button", v = g(m({ variant: e, size: r, className: t }));
|
|
145
|
+
return /* @__PURE__ */ i(p, { className: v, style: a.style, ref: d, ...a, children: c(s) });
|
|
146
|
+
}
|
|
147
|
+
);
|
|
148
|
+
y.displayName = "EnhancedButton";
|
|
149
|
+
export {
|
|
150
|
+
l as B,
|
|
151
|
+
y as E,
|
|
152
|
+
h as b,
|
|
153
|
+
m as e,
|
|
154
|
+
c as w
|
|
155
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";const i=require("react/jsx-runtime"),w=require("react"),l=require("@radix-ui/react-slot"),g=require("class-variance-authority"),f=require("./utils-IjLH3w2e.cjs");function _(r){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(r){for(const t in r)if(t!=="default"){const n=Object.getOwnPropertyDescriptor(r,t);Object.defineProperty(e,t,n.get?n:{enumerable:!0,get:()=>r[t]})}}return e.default=r,Object.freeze(e)}const o=_(w);function d(r){return o.Children.map(r,(e,t)=>{if(e===null||e===!1)return e;if(typeof e=="string"||typeof e=="number")return i.jsx("span",{className:"min-w-0 shrink truncate",children:e},`nqui-inline-lbl-${t}`);if(o.isValidElement(e)&&e.type===o.Fragment){const{children:n}=e.props;return i.jsx(o.Fragment,{children:d(n)},`nqui-inline-fr-${t}`)}return e})}const p=g.cva("inline-flex min-w-0 max-w-full items-center justify-center gap-2 whitespace-nowrap rounded-full text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",{variants:{variant:{default:"bg-primary text-primary-foreground hover:bg-primary/90",destructive:"bg-destructive text-destructive-foreground hover:bg-destructive/90",outline:"border border-input bg-background hover:bg-accent hover:text-accent-foreground",secondary:"bg-secondary text-secondary-foreground hover:bg-secondary/80",ghost:"hover:bg-accent hover:text-accent-foreground",link:"text-primary underline-offset-4 hover:underline"},size:{default:"h-7 min-w-7 px-3",sm:"h-6 min-w-6 px-2 text-xs",lg:"h-8 min-w-8 px-4",icon:"h-7 w-7 p-0"}},defaultVariants:{variant:"default",size:"default"}}),u=o.forwardRef(({className:r,variant:e,size:t,asChild:n=!1,children:s,...a},c)=>{const b=n?l.Slot:"button";return i.jsx(b,{className:f.cn(p({variant:e,size:t,className:r})),ref:c,...a,children:d(s)})});u.displayName="Button";const v=g.cva("inline-flex min-w-0 max-w-full items-center justify-center gap-2 whitespace-nowrap rounded-full text-sm font-medium leading-normal text-center cursor-pointer select-none touch-manipulation transition-[color,background-color,border-color,box-shadow,opacity,transform] duration-150 ease-in-out focus:outline-0 focus-visible:outline-0 disabled:pointer-events-none disabled:opacity-65 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",{variants:{variant:{default:["bg-primary text-primary-foreground border border-primary","nqui-button-gradient nqui-button-shadow","opacity-90 hover:opacity-100","hover:bg-primary/90 hover:border-primary/90","focus:bg-primary/80 focus:border-primary/80","active:bg-primary/75 active:border-primary/75 active:shadow-[inset_0_3px_5px_rgba(0,0,0,0.125)] active:scale-95","disabled:bg-transparent disabled:shadow-none disabled:opacity-65"],destructive:["bg-destructive text-destructive-foreground border border-destructive","nqui-button-gradient nqui-button-shadow","opacity-90 hover:opacity-100","hover:bg-destructive/90 hover:border-destructive/90","focus:bg-destructive/80 focus:border-destructive/80","active:bg-destructive/75 active:border-destructive/75 active:shadow-[inset_0_3px_5px_rgba(0,0,0,0.125)] active:scale-95","disabled:bg-transparent disabled:shadow-none disabled:opacity-65"],secondary:["bg-secondary text-secondary-foreground border border-border","nqui-button-gradient nqui-button-shadow","opacity-90 hover:opacity-100","hover:bg-secondary/90 hover:border-border","focus:bg-secondary/80 focus:border-border","active:bg-secondary/75 active:border-border active:shadow-[inset_0_3px_5px_rgba(0,0,0,0.125)] active:scale-95","disabled:bg-transparent disabled:shadow-none disabled:opacity-65"],success:["bg-success text-success-foreground border border-success","nqui-button-gradient nqui-button-shadow","opacity-90 hover:opacity-100","hover:bg-success/90 hover:border-success/90","focus:bg-success/80 focus:border-success/80","active:bg-success/75 active:border-success/75 active:shadow-[inset_0_3px_5px_rgba(0,0,0,0.125)] active:scale-95","disabled:bg-transparent disabled:shadow-none disabled:opacity-65"],warning:["bg-warning text-warning-foreground border border-warning","nqui-button-gradient nqui-button-shadow","opacity-90 hover:opacity-100","hover:bg-warning/90 hover:border-warning/90","focus:bg-warning/80 focus:border-warning/80","active:bg-warning/75 active:border-warning/75 active:shadow-[inset_0_3px_5px_rgba(0,0,0,0.125)] active:scale-95","disabled:bg-transparent disabled:shadow-none disabled:opacity-65"],info:["bg-info text-info-foreground border border-info","nqui-button-gradient nqui-button-shadow","opacity-90 hover:opacity-100","hover:bg-info/90 hover:border-info/90","focus:bg-info/80 focus:border-info/80","active:bg-info/75 active:border-info/75 active:shadow-[inset_0_3px_5px_rgba(0,0,0,0.125)] active:scale-95","disabled:bg-transparent disabled:shadow-none disabled:opacity-65"],outline:"border border-input bg-background hover:bg-accent hover:text-accent-foreground",ghost:"hover:bg-accent hover:text-accent-foreground",link:"text-primary underline-offset-4 hover:underline"},size:{default:"h-7 min-w-7 px-3",sm:"h-6 min-w-6 px-2 text-xs",lg:"h-8 min-w-8 px-4",icon:"h-7 w-7 p-0"}},defaultVariants:{variant:"default",size:"default"}}),h=o.forwardRef(({className:r,variant:e,size:t,asChild:n=!1,children:s,...a},c)=>{if(!(e&&["default","destructive","secondary","success","warning","info"].includes(e))&&e){const x=e==="outline"||e==="ghost"||e==="link"?e:"default";return i.jsx(u,{ref:c,variant:x,size:t,className:r,asChild:n,...a,children:s})}const y=n?l.Slot:"button",m=f.cn(v({variant:e,size:t,className:r}));return i.jsx(y,{className:m,style:a.style,ref:c,...a,children:d(s)})});h.displayName="EnhancedButton";exports.Button=u;exports.EnhancedButton=h;exports.buttonVariants=p;exports.enhancedButtonVariants=v;exports.wrapInlineLabelTextNodes=d;
|
package/dist/calendar.cjs.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("./enhanced-calendar-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("./enhanced-calendar-C7EQIr6i.cjs");exports.Calendar=a.EnhancedCalendar;exports.CalendarDayButton=a.CalendarDayButton;exports.CoreCalendar=a.Calendar;
|
package/dist/calendar.es.js
CHANGED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";const n=require("react/jsx-runtime"),S=require("react"),z=require("embla-carousel-react"),h=require("./keyboard-BapbM2wb.cjs"),f=require("./utils-IjLH3w2e.cjs"),y=require("./button-R304rhsj.cjs"),m=require("@hugeicons/react"),C=require("@hugeicons/core-free-icons");function q(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const o in e)if(o!=="default"){const s=Object.getOwnPropertyDescriptor(e,o);Object.defineProperty(t,o,s.get?s:{enumerable:!0,get:()=>e[o]})}}return t.default=e,Object.freeze(t)}const a=q(S),b=a.createContext(null);function p(){const e=a.useContext(b);if(!e)throw new Error("useCarousel must be used within a <Carousel />");return e}function I({orientation:e="horizontal",opts:t,setApi:o,plugins:s,className:c,children:i,...u}){const[N,r]=z({...t,axis:e==="horizontal"?"x":"y"},s),[g,j]=a.useState(!1),[w,k]=a.useState(!1),d=a.useCallback(l=>{l&&(j(l.canScrollPrev()),k(l.canScrollNext()))},[]),x=a.useCallback(()=>{r?.scrollPrev()},[r]),v=a.useCallback(()=>{r?.scrollNext()},[r]),P=a.useCallback(l=>{l.key===h.Keys.ArrowLeft?(l.preventDefault(),x()):l.key===h.Keys.ArrowRight&&(l.preventDefault(),v())},[x,v]);return a.useEffect(()=>{!r||!o||o(r)},[r,o]),a.useEffect(()=>{if(r)return d(r),r.on("reInit",d),r.on("select",d),()=>{r?.off("select",d)}},[r,d]),n.jsx(b.Provider,{value:{carouselRef:N,api:r,opts:t,orientation:e||(t?.axis==="y"?"vertical":"horizontal"),scrollPrev:x,scrollNext:v,canScrollPrev:g,canScrollNext:w},children:n.jsx("div",{onKeyDownCapture:P,className:f.cn("relative min-w-0 group/carousel",c),role:"region","aria-roledescription":"carousel","data-slot":"carousel",...u,children:i})})}function R({className:e,...t}){const{carouselRef:o,orientation:s}=p();return n.jsx("div",{ref:o,className:"overflow-hidden","data-slot":"carousel-content",children:n.jsx("div",{className:f.cn("flex",s==="horizontal"?"-ml-4":"-mt-4 flex-col",e),...t})})}function D({className:e,...t}){const{orientation:o}=p();return n.jsx("div",{role:"group","aria-roledescription":"slide","data-slot":"carousel-item",className:f.cn("min-w-0 shrink-0 grow-0 basis-full",o==="horizontal"?"pl-4":"pt-4",e),...t})}function O({className:e,variant:t="outline",size:o="icon",...s}){const{orientation:c,scrollPrev:i,canScrollPrev:u}=p();return n.jsxs(y.Button,{"data-slot":"carousel-previous",variant:t,size:o,className:f.cn("rounded-full absolute touch-manipulation z-[var(--z-content)] opacity-35 shadow-sm transition-[opacity,transform] duration-150 ease-out hover:opacity-100 focus-visible:opacity-100 active:opacity-100 group-hover/carousel:opacity-75 disabled:pointer-events-none disabled:opacity-20",c==="horizontal"?"top-1/2 left-2 -translate-y-1/2":"top-2 left-1/2 -translate-x-1/2 rotate-90",e),disabled:!u,onClick:i,...s,children:[n.jsx(m.HugeiconsIcon,{icon:C.ArrowLeft01Icon,strokeWidth:2}),n.jsx("span",{className:"sr-only",children:"Previous slide"})]})}function E({className:e,variant:t="outline",size:o="icon",...s}){const{orientation:c,scrollNext:i,canScrollNext:u}=p();return n.jsxs(y.Button,{"data-slot":"carousel-next",variant:t,size:o,className:f.cn("rounded-full absolute touch-manipulation z-[var(--z-content)] opacity-35 shadow-sm transition-[opacity,transform] duration-150 ease-out hover:opacity-100 focus-visible:opacity-100 active:opacity-100 group-hover/carousel:opacity-75 disabled:pointer-events-none disabled:opacity-20",c==="horizontal"?"top-1/2 right-2 -translate-y-1/2":"bottom-2 left-1/2 -translate-x-1/2 rotate-90",e),disabled:!u,onClick:i,...s,children:[n.jsx(m.HugeiconsIcon,{icon:C.ArrowRight01Icon,strokeWidth:2}),n.jsx("span",{className:"sr-only",children:"Next slide"})]})}exports.Carousel=I;exports.CarouselContent=R;exports.CarouselItem=D;exports.CarouselNext=E;exports.CarouselPrevious=O;
|