@uselets/ui 1.0.0 → 1.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +29 -12
- package/dist/cli/uselets.mjs +2 -2
- package/dist/cli/uselets.mjs.map +1 -1
- package/dist/components/card.js +1 -1
- package/dist/components/card.js.map +1 -1
- package/dist/components/combobox.d.ts +4 -1
- package/dist/components/combobox.js +1 -1
- package/dist/components/combobox.js.map +1 -1
- package/dist/components/dialog.d.ts +6 -12
- package/dist/components/dialog.js +1 -1
- package/dist/components/dialog.js.map +1 -1
- package/dist/components/field.js +1 -1
- package/dist/components/field.js.map +1 -1
- package/dist/components/sidebar.js +1 -1
- package/dist/components/sidebar.js.map +1 -1
- package/dist/components/skeleton.d.ts +5 -1
- package/dist/components/skeleton.js +1 -1
- package/dist/components/skeleton.js.map +1 -1
- package/dist/components/skeleton.spec.d.ts +1 -0
- package/dist/components/skeleton.spec.js +2 -0
- package/dist/components/skeleton.spec.js.map +1 -0
- package/dist/components/tooltip.d.ts +20 -4
- package/dist/components/tooltip.js +1 -1
- package/dist/components/tooltip.js.map +1 -1
- package/dist/components/unstyled-button.d.ts +17 -0
- package/dist/components/unstyled-button.js +2 -0
- package/dist/components/unstyled-button.js.map +1 -0
- package/dist/hooks/use-breakpoint-value.spec.js +1 -1
- package/dist/hooks/use-breakpoint.spec.js +1 -1
- package/dist/hooks/use-disclosure.spec.js +1 -1
- package/dist/hooks/use-document-visibility.spec.js +1 -1
- package/dist/hooks/use-idle.spec.js +1 -1
- package/dist/hooks/use-interval.spec.js +1 -1
- package/dist/hooks/use-local-storage.spec.js +1 -1
- package/dist/hooks/use-mobile.spec.js +1 -1
- package/dist/index.d.ts +3 -2
- package/dist/index.js +1 -1
- package/dist/{react.esm-BuxkFT_p.js → react.esm-B3a5z6DL.js} +2 -2
- package/dist/{react.esm-BuxkFT_p.js.map → react.esm-B3a5z6DL.js.map} +1 -1
- package/dist/skills/uselets-ui/SKILL.md +5 -5
- package/dist/skills/uselets-ui/references/component-catalog.md +8 -2
- package/dist/skills/uselets-ui/references/package-guide.md +23 -11
- package/dist/skills/uselets-ui/scripts/print-public-api.mjs +0 -1
- package/dist/styles/base.css +13 -0
- package/dist/styles/globals.css +8 -0
- package/dist/styles/gomax.css +202 -0
- package/dist/styles/max.css +203 -0
- package/dist/styles/theme.css +195 -0
- package/dist/themes/gomax.css +3 -2
- package/dist/themes/max.css +3 -2
- package/package.json +1 -2
- package/skills/uselets-ui/SKILL.md +5 -5
- package/skills/uselets-ui/references/component-catalog.md +8 -2
- package/skills/uselets-ui/references/package-guide.md +23 -11
- package/skills/uselets-ui/scripts/print-public-api.mjs +0 -1
- package/dist/styles.css +0 -2
package/README.md
CHANGED
|
@@ -76,24 +76,33 @@ npm install tailwindcss @tailwindcss/postcss
|
|
|
76
76
|
export { default } from '@uselets/ui/postcss.config'
|
|
77
77
|
```
|
|
78
78
|
|
|
79
|
-
3. Import Tailwind in your global stylesheet:
|
|
79
|
+
3. Import Tailwind, one package theme, and the Inter font in your global stylesheet:
|
|
80
80
|
|
|
81
81
|
```css
|
|
82
82
|
/* app.css */
|
|
83
83
|
@import 'tailwindcss';
|
|
84
|
+
@import '@uselets/ui/themes/max.css';
|
|
85
|
+
@import '@fontsource-variable/inter';
|
|
86
|
+
```
|
|
87
|
+
|
|
88
|
+
Use `@uselets/ui/themes/gomax.css` instead for GoMax apps. If your app consumes `@uselets/ui` components, add a
|
|
89
|
+
source directive so Tailwind can generate classes used by the package:
|
|
90
|
+
|
|
91
|
+
```css
|
|
92
|
+
@source '../node_modules/@uselets/ui/dist';
|
|
84
93
|
```
|
|
85
94
|
|
|
86
95
|
## Quick start
|
|
87
96
|
|
|
88
|
-
1. Import one package theme once in your
|
|
97
|
+
1. Import one package theme once in your global stylesheet:
|
|
89
98
|
|
|
90
|
-
```
|
|
91
|
-
import '
|
|
92
|
-
import '@
|
|
99
|
+
```css
|
|
100
|
+
@import 'tailwindcss';
|
|
101
|
+
@import '@uselets/ui/themes/max.css';
|
|
102
|
+
@import '@fontsource-variable/inter';
|
|
93
103
|
```
|
|
94
104
|
|
|
95
|
-
For GoMax apps, import `@uselets/ui/themes/gomax.css` instead.
|
|
96
|
-
`@uselets/ui/styles.css` entrypoint is still available and is equivalent to the Max theme.
|
|
105
|
+
For GoMax apps, import `@uselets/ui/themes/gomax.css` instead.
|
|
97
106
|
|
|
98
107
|
2. Import components from the package root:
|
|
99
108
|
|
|
@@ -127,7 +136,6 @@ The package ships brand theme entrypoints:
|
|
|
127
136
|
- `@uselets/ui/themes/max.css`
|
|
128
137
|
- `@uselets/ui/themes/gomax.css`
|
|
129
138
|
|
|
130
|
-
The compatibility stylesheet (`@uselets/ui/styles.css`) uses the Max theme.
|
|
131
139
|
Max and GoMax are maintained from their respective Figma style guides. The Storybook
|
|
132
140
|
`Foundations/Themes` story reads the active stylesheet tokens, so it is the theme-backed
|
|
133
141
|
palette preview for both theme entrypoints.
|
|
@@ -223,12 +231,13 @@ You can import from the package root (`@uselets/ui`) or by subpath (`@uselets/ui
|
|
|
223
231
|
| `anchor` | `Anchor`, `anchorVariants` | Link primitive rendered as `<a>` with `size: 'xs' \| 'sm' \| 'md' \| 'lg' \| 'xl'`, `underline: 'always' \| 'hover' \| 'never' \| 'not-hover'` (default: `hover`), and `asChild`. |
|
|
224
232
|
| `avatar` | `Avatar`, `AvatarImage`, `AvatarFallback`, `AvatarBadge`, `AvatarGroup`, `AvatarGroupCount` | `Avatar` supports `size: 'sm' \| 'md' \| 'lg'` (default: `md`). |
|
|
225
233
|
| `button` | `Button`, `buttonVariants` | `variant: 'solid' \| 'outline' \| 'subtle' \| 'ghost' \| 'link'` (default: `solid`); `color: UIColor` (default: `primary`); `size: 'xs' \| 'sm' \| 'md' \| 'lg' \| 'xl' \| 'icon-xs' \| 'icon-sm' \| 'icon' \| 'icon-lg' \| 'icon-xl'`; `loading?: boolean`. |
|
|
234
|
+
| `unstyled-button` | `UnstyledButton` | Button primitive with reset styles, pointer cursor, accessible focus ring, default `type="button"`, and `asChild`. |
|
|
226
235
|
| `calendar` | `Calendar`, `CalendarDayButton` | Also exports the `DateRange` type. Weekends render with destructive text, week numbers are low-emphasis, and selected single/range endpoints use the `primary` palette with a subtle primary range fill. |
|
|
227
236
|
| `date-range-picker` | `DateRangePicker`, `DateRangePickerTrigger`, `DateRangePickerValue`, `DateRangePickerContent`, `DateRangePickerPresets`, `DateRangePickerPreset`, `DateRangePickerCalendar`, `DateRangePickerDateFields`, `DateRangePickerActions`, `DateRangePickerApply`, `DateRangePickerReset` | Compound popover picker backed by `Calendar` range mode. Draft edits from fixed presets, relative-day inputs, date inputs, and calendar stay in sync until `Apply`; reset/clear emits `null` through `onValueChange`. |
|
|
228
237
|
| `card` | `Card`, `CardHeader`, `CardTitle`, `CardDescription`, `CardAction`, `CardContent`, `CardFooter` | `Card` supports `size: 'sm' \| 'md'` (default: `md`). |
|
|
229
238
|
| `checkbox` | `Checkbox` | `Checkbox` supports `size: 'sm' \| 'md' \| 'lg'` (default: `md`), `color: UIColor` (default: `primary`), `label?: React.ReactNode`, and `labelProps` for the composed `Label`. When `label` is provided without `id`, it generates an id and wires `htmlFor` automatically. Label text follows checkbox size: `sm` 12px, `md` 14px, `lg` 20px. |
|
|
230
239
|
| `code` | `Code` | Inline code primitive rendered as `<code>`. |
|
|
231
|
-
| `combobox` | `Combobox`, `ComboboxInput`, `ComboboxContent`, `ComboboxList`, `ComboboxItem`, `ComboboxGroup`, `ComboboxLabel`, `ComboboxCollection`, `ComboboxClear`, `ComboboxEmpty`, `ComboboxSeparator`, `ComboboxChips`, `ComboboxChip`, `ComboboxChipsInput`, `ComboboxTrigger`, `ComboboxValue`, `useComboboxAnchor` | `ComboboxInput` supports `icon?: React.ReactNode`, `triggerIcon?: React.ReactNode`, `showTrigger?: boolean`, and `showClear?: boolean`;
|
|
240
|
+
| `combobox` | `Combobox`, `ComboboxInput`, `ComboboxContent`, `ComboboxList`, `ComboboxItem`, `ComboboxGroup`, `ComboboxLabel`, `ComboboxCollection`, `ComboboxClear`, `ComboboxEmpty`, `ComboboxSeparator`, `ComboboxChips`, `ComboboxChip`, `ComboboxChipsInput`, `ComboboxTrigger`, `ComboboxValue`, `useComboboxAnchor` | `ComboboxInput` supports `icon?: React.ReactNode`, `triggerIcon?: React.ReactNode`, `showTrigger?: boolean`, and `showClear?: boolean`; `ComboboxContent` supports `container` for rendering inside overlays such as dialogs. |
|
|
232
241
|
| `dialog` | `Dialog`, `DialogTrigger`, `DialogPortal`, `DialogClose`, `DialogOverlay`, `DialogContent`, `DialogHeader`, `DialogFooter`, `DialogTitle`, `DialogDescription` | `Dialog` supports `size: 'sm' \| 'md' \| 'lg' \| 'xl' \| '2xl'` (default: `sm`); `DialogContent.showCloseButton` (default: `true`); `DialogFooter.showCloseButton` (default: `false`). |
|
|
233
242
|
| `drawer` | `Drawer`, `DrawerTrigger`, `DrawerPortal`, `DrawerClose`, `DrawerOverlay`, `DrawerContent`, `DrawerHeader`, `DrawerFooter`, `DrawerTitle`, `DrawerDescription` | `Drawer` supports `size: 'sm' \| 'md' \| 'lg'` (default: `sm`). Direction (`top/right/bottom/left`) is handled by Vaul root props. |
|
|
234
243
|
| `dropzone` | `Dropzone`, `DropzoneArea`, `DropzoneDescription`, `DropzoneFileList`, `DropzoneFileListItem`, `DropzoneFileMessage`, `DropzoneMessage`, `DropzoneRemoveFile`, `DropzoneRetryFile`, `DropzoneTrigger`, `InfiniteProgress`, `useDropzone` | `useDropzone` manages upload lifecycle, validation (`accept`, `minSize`, `maxSize`, `maxFiles`), retry handling, and optional `shiftOnMaxFiles` replacement. Compose the returned state with `Dropzone` and its subcomponents. |
|
|
@@ -248,13 +257,13 @@ You can import from the package root (`@uselets/ui`) or by subpath (`@uselets/ui
|
|
|
248
257
|
| `select` | `Select`, `SelectTrigger`, `SelectValue`, `SelectContent`, `SelectGroup`, `SelectItem`, `SelectLabel`, `SelectSeparator`, `SelectScrollUpButton`, `SelectScrollDownButton` | `SelectTrigger.size: 'sm' \| 'md'`; `SelectContent` supports positioning props (`side`, `sideOffset`, `align`, `alignOffset`, `alignItemWithTrigger`). |
|
|
249
258
|
| `separator` | `Separator` | `orientation: 'horizontal' \| 'vertical'` (default: `horizontal`). |
|
|
250
259
|
| `simple-grid` | `SimpleGrid` | Simple grid with `cols`, `gap`, `rowGap`, and `columnGap`. `cols` accepts a number; spacing uses the `xs` to `xl` scale. Use `useBreakpointValue` when column count needs responsive values. |
|
|
251
|
-
| `skeleton` | `Skeleton` | Generic loading placeholder block. |
|
|
260
|
+
| `skeleton` | `Skeleton` | Generic loading placeholder block. Supports `visible?: boolean` (default: `true`) and can wrap `children` to reserve their size while the placeholder is shown. |
|
|
252
261
|
| `spinner` | `Spinner` | Loader icon (`role="status"`), accepts SVG props and supports `size: 'sm' \| 'md' \| 'lg'` (default: `md`). |
|
|
253
262
|
| `switch` | `Switch` | `Switch` supports `size: 'sm' \| 'md' \| 'lg'` (default: `md`), `color: UIColor` (default: `green`), `label?: React.ReactNode`, and `labelProps` for the composed `Label`. When `label` is provided without `id`, it generates an id and wires `htmlFor` automatically. Track size is `sm` 34x16px, `md` 42x20px, and `lg` 48x22px; the thumb and internal indicator scale with the switch. Label text follows switch size: `sm` 12px, `md` 14px, `lg` 20px. |
|
|
254
263
|
| `tabs` | `Tabs`, `TabsContent`, `TabsList`, `TabsTrigger`, `tabsListVariants` | `TabsList.variant: 'line' \| 'enclosed'` (default: `line`); `TabsList.grow?: boolean` makes horizontal tabs share the available width equally; `line` uses a neutral border line with a `primary` active indicator. |
|
|
255
264
|
| `text` | `Text`, `textVariants` | Text primitive with `size: 'xs' \| 'sm' \| 'md' \| 'lg' \| 'xl'` (default: `md`) and `asChild`. |
|
|
256
265
|
| `timeline` | `Timeline`, `TimelineItem`, `TimelineConnector`, `TimelineContent`, `TimelineDescription`, `TimelineEmpty`, `TimelineHeader`, `TimelineIcon`, `TimelineTime`, `TimelineTitle`, `timelineVariants` | `Timeline.size: 'sm' \| 'md' \| 'lg'` (default: `md`); `Timeline.iconSize: 'sm' \| 'md' \| 'lg'`; `TimelineItem.status: 'completed' \| 'in-progress' \| 'pending'`; icon and connector colors use the semantic palette (`primary`, `secondary`, `muted`, `accent`, `destructive`). |
|
|
257
|
-
| `tooltip` | `TooltipProvider`, `Tooltip`, `TooltipTrigger`, `TooltipContent` | `
|
|
266
|
+
| `tooltip` | `TooltipProvider`, `Tooltip`, `TooltipRoot`, `TooltipTrigger`, `TooltipContent` | `Tooltip` composes a trigger and label for common usage and supports `disabled`; `TooltipRoot` is the low-level root for manual composition; `TooltipContent` supports positioning props like `side`, `align`, and `sideOffset`. |
|
|
258
267
|
| `visibility` | `HiddenFrom`, `VisibleFrom` | Breakpoint visibility helpers. `HiddenFrom breakpoint="md"` hides at `md` and above; `VisibleFrom breakpoint="md"` shows at `md` and above. |
|
|
259
268
|
| `sonner` | `Toaster`, `toast` | Toaster wrapper around Sonner with theme integration from `next-themes` and custom icons. |
|
|
260
269
|
|
|
@@ -328,9 +337,17 @@ export function App() {
|
|
|
328
337
|
For consistent tooltip behavior across the app, wrap your application root with `TooltipProvider`.
|
|
329
338
|
|
|
330
339
|
```tsx
|
|
331
|
-
import { TooltipProvider } from '@uselets/ui/tooltip'
|
|
340
|
+
import { Tooltip, TooltipProvider } from '@uselets/ui/tooltip'
|
|
332
341
|
|
|
333
342
|
export function AppRoot() {
|
|
334
343
|
return <TooltipProvider delayDuration={200}>{/* app */}</TooltipProvider>
|
|
335
344
|
}
|
|
345
|
+
|
|
346
|
+
export function SaveButton() {
|
|
347
|
+
return (
|
|
348
|
+
<Tooltip label="Salva as alterações" side="bottom">
|
|
349
|
+
<button type="button">Salvar</button>
|
|
350
|
+
</Tooltip>
|
|
351
|
+
)
|
|
352
|
+
}
|
|
336
353
|
```
|
package/dist/cli/uselets.mjs
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
#!/usr/bin/env node
|
|
2
2
|
import{spawn as e}from"node:child_process";import t from"node:fs/promises";import n from"node:path";import r from"node:readline/promises";import{fileURLToPath as i}from"node:url";import{Command as a,Option as o}from"commander";const s=`uselets-ui`,c={codex:n.join(`.agents`,`skills`,s),claude:n.join(`.claude`,`skills`,s)},l=Object.keys(c);async function u(e){try{return await t.access(e),!0}catch{return!1}}async function d(e){return JSON.parse(await t.readFile(e,`utf8`))}async function f(){let e=i(new URL(`.`,import.meta.url));for(;;)try{return await t.access(n.join(e,`package.json`)),e}catch{let t=n.dirname(e);if(t===e)throw Error(`Unable to resolve @uselets/ui package root`);e=t}}function p(e){return e===`all`?l:[e]}function m(e,t){return!!(e.dependencies?.[t]||e.devDependencies?.[t]||e.peerDependencies?.[t]||e.optionalDependencies?.[t])}async function h(e,t){let r=t.packageManager?.split(`@`)[0];return r===`bun`||r===`pnpm`||r===`yarn`||r===`npm`?r:await u(n.join(e,`bun.lock`))?`bun`:await u(n.join(e,`pnpm-lock.yaml`))?`pnpm`:await u(n.join(e,`yarn.lock`))?`yarn`:(await u(n.join(e,`package-lock.json`)),`npm`)}function g(e,t,n){switch(e){case`bun`:return[`bun`,`add`,...n?[`-d`]:[],...t];case`pnpm`:return[`pnpm`,`add`,...n?[`-D`]:[],...t];case`yarn`:return[`yarn`,`add`,...n?[`-D`]:[],...t];case`npm`:return[`npm`,`install`,...n?[`-D`]:[],...t]}}async function _(t,n){let[r,...i]=t;if(!r)throw Error(`Missing command`);console.log(`Running: ${t.join(` `)}`),await new Promise((t,a)=>{let o=e(r,i,{cwd:n,stdio:`inherit`});o.on(`error`,a),o.on(`close`,e=>{if(e===0){t();return}a(Error(`${r} exited with code ${e}`))})})}function v(e,t){let n=e.dependencies?.[t]??e.devDependencies?.[t];if(!n)throw Error(`Unable to find ${t} version in @uselets/ui package metadata`);return n}async function y(e,t){let r=await f(),i=await d(n.join(r,`package.json`)),a=await h(e,t),o=[],s=[];if(!i.name||!i.version)throw Error(`Unable to resolve @uselets/ui package name and version`);m(t,i.name)||o.push(`${i.name}@${i.version}`),m(t,`@fontsource-variable/inter`)||o.push(`@fontsource-variable/inter@${v(i,`@fontsource-variable/inter`)}`),m(t,`tailwindcss`)||s.push(`tailwindcss@${v(i,`tailwindcss`)}`),m(t,`@tailwindcss/postcss`)||s.push(`@tailwindcss/postcss@${v(i,`@tailwindcss/postcss`)}`),o.length>0?await _(g(a,o,!1),e):console.log(`Runtime dependencies already declared.`),s.length>0?await _(g(a,s,!0),e):console.log(`Tailwind dependencies already declared.`)}async function b(e){let r=await f(),i=n.join(r,`skills`,s);try{await t.access(i)}catch{throw Error(`Bundled skill not found at ${i}`)}let a=[];for(let r of e){let e=n.join(process.cwd(),c[r]);await t.rm(e,{recursive:!0,force:!0}),await t.mkdir(n.dirname(e),{recursive:!0}),await t.cp(i,e,{recursive:!0}),a.push(e)}console.log(`Installed ${s} skill:`);for(let e of a)console.log(`- ${e}`)}async function x(){return r.createInterface({input:process.stdin,output:process.stdout})}async function S(e){if(!process.stdin.isTTY)return e;let t=await x();try{for(;;){let n=(await t.question(`Theme (max/gomax) [${e}]: `)).trim().toLowerCase();if(!n)return e;if(n===`max`||n===`gomax`)return n;console.log(`Please choose "max" or "gomax".`)}}finally{t.close()}}async function C(e){if(!process.stdin.isTTY)return e;let t=await x();try{return(await t.question(`Global CSS path [${e}]: `)).trim()||e}finally{t.close()}}async function w(){if(!process.stdin.isTTY)return!1;let e=await x();try{for(;;){let t=(await e.question(`Install agent skill? (y/N): `)).trim().toLowerCase();if(!t||t===`n`||t===`no`)return!1;if(t===`y`||t===`yes`)return!0;console.log(`Please answer "y" or "n".`)}}finally{e.close()}}async function T(e){let r=n.join(e,`postcss.config.mjs`);if(await u(r)){console.log(`Preserved existing postcss.config.mjs.`);return}await t.writeFile(r,`export { default } from '@uselets/ui/postcss.config'
|
|
3
|
-
`),console.log(`Created postcss.config.mjs.`)}function E(e,t){let
|
|
3
|
+
`),console.log(`Created postcss.config.mjs.`)}function E(e){let t=n.posix.dirname(e.replaceAll(n.sep,n.posix.sep)),r=n.posix.relative(t,`node_modules/@uselets/ui/dist`);return r.startsWith(`.`)?r:`./${r}`}function D(e,t,n){let r=[],i=/@import\s+['"]tailwindcss['"]/.test(e),a=/@import\s+['"]@uselets\/ui\/themes\/(?:max|gomax)\.css['"]/.test(e),o=/@import\s+['"]@fontsource-variable\/inter['"]/.test(e),s=/@source\s+['"][^'"]*@uselets\/ui\/dist['"]/.test(e);return i||r.push(`@import 'tailwindcss';`),a||r.push(`@import '@uselets/ui/themes/${t}.css';`),o||r.push(`@import '@fontsource-variable/inter';`),s||r.push(`@source '${E(n)}';`),{imports:r,hasTheme:a}}async function O(e,r,i){let a=n.resolve(e,r),o=await u(a)?await t.readFile(a,`utf8`):``,{imports:s,hasTheme:c}=D(o,i,r);if(c&&console.log(`Preserved existing @uselets/ui theme import.`),s.length===0){console.log(`Global CSS already configured at ${r}.`);return}let l=o.length>0&&!o.startsWith(`
|
|
4
4
|
`)?`
|
|
5
5
|
`:``,d=`${s.join(`
|
|
6
|
-
`)}${l}${o}`;await t.mkdir(n.dirname(a),{recursive:!0}),await t.writeFile(a,d),console.log(`Updated global CSS at ${r}.`)}async function
|
|
6
|
+
`)}${l}${o}`;await t.mkdir(n.dirname(a),{recursive:!0}),await t.writeFile(a,d),console.log(`Updated global CSS at ${r}.`)}async function k(e){let t=process.cwd(),r=n.join(t,`package.json`);if(!await u(r))throw Error(`No package.json found in the current directory. Run uselets init from your project root.`);let i=await d(r),a=e.theme??await S(`max`),o=e.css??await C(`src/styles/globals.css`),s=e.installSkill??await w();await y(t,i),await T(t),await O(t,o,a),s&&await b(l)}async function A(){let e=new a;if(e.name(`uselets`).description(`CLI for @uselets/ui`).showHelpAfterError(),e.command(`skill`).description(`Reinstall the ${s} agent skill`).addOption(new o(`--agent <agent>`,`Target agent directory`).choices([`codex`,`claude`,`all`]).default(`all`)).action(async e=>{await b(p(e.agent))}),e.command(`init`).description(`Set up @uselets/ui in this project`).addOption(new o(`--theme <theme>`,`Theme to import`).choices([`max`,`gomax`])).option(`--css <path>`,`Global CSS file path`).option(`--install-skill`,`Install the agent skill without prompting`).option(`--no-install-skill`,`Skip the agent skill prompt and installation`).action(async e=>{await k(e)}),process.argv.length<=2){e.outputHelp();return}await e.parseAsync()}A().catch(e=>{console.error(e instanceof Error?e.message:e),process.exitCode=1});export{};
|
|
7
7
|
//# sourceMappingURL=uselets.mjs.map
|
package/dist/cli/uselets.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"uselets.mjs","names":[],"sources":["../../src/cli/uselets.ts"],"sourcesContent":["#!/usr/bin/env node\n\nimport { spawn } from 'node:child_process'\nimport fs from 'node:fs/promises'\nimport path from 'node:path'\nimport readline from 'node:readline/promises'\nimport { fileURLToPath } from 'node:url'\n\nimport { Command, Option } from 'commander'\n\nconst SKILL_NAME = 'uselets-ui'\nconst DEFAULT_CSS_PATH = 'src/styles/globals.css'\nconst POSTCSS_CONFIG = \"export { default } from '@uselets/ui/postcss.config'\\n\"\nconst AGENT_TARGETS = {\n codex: path.join('.agents', 'skills', SKILL_NAME),\n claude: path.join('.claude', 'skills', SKILL_NAME)\n} as const\n\ntype AgentTarget = keyof typeof AGENT_TARGETS\ntype AgentOption = AgentTarget | 'all'\ntype ThemeOption = 'max' | 'gomax'\ntype PackageManager = 'bun' | 'pnpm' | 'yarn' | 'npm'\ntype PackageJson = {\n name?: string\n version?: string\n packageManager?: string\n dependencies?: Record<string, string>\n devDependencies?: Record<string, string>\n peerDependencies?: Record<string, string>\n optionalDependencies?: Record<string, string>\n}\ntype InitOptions = {\n theme?: ThemeOption\n css?: string\n installSkill?: boolean\n}\n\nconst ALL_AGENT_TARGETS = Object.keys(AGENT_TARGETS) as AgentTarget[]\n\nasync function pathExists(targetPath: string) {\n try {\n await fs.access(targetPath)\n return true\n } catch {\n return false\n }\n}\n\nasync function readJsonFile<T>(filePath: string) {\n return JSON.parse(await fs.readFile(filePath, 'utf8')) as T\n}\n\nasync function findPackageRoot() {\n let currentDir = fileURLToPath(new URL('.', import.meta.url))\n\n while (true) {\n try {\n await fs.access(path.join(currentDir, 'package.json'))\n return currentDir\n } catch {\n const parentDir = path.dirname(currentDir)\n\n if (parentDir === currentDir) {\n throw new Error('Unable to resolve @uselets/ui package root')\n }\n\n currentDir = parentDir\n }\n }\n}\n\nfunction resolveTargets(agent: AgentOption) {\n return agent === 'all' ? ALL_AGENT_TARGETS : [agent]\n}\n\nfunction hasDependency(packageJson: PackageJson, dependencyName: string) {\n return Boolean(\n packageJson.dependencies?.[dependencyName] ||\n packageJson.devDependencies?.[dependencyName] ||\n packageJson.peerDependencies?.[dependencyName] ||\n packageJson.optionalDependencies?.[dependencyName]\n )\n}\n\nasync function detectPackageManager(projectRoot: string, packageJson: PackageJson): Promise<PackageManager> {\n const declaredManager = packageJson.packageManager?.split('@')[0]\n\n if (\n declaredManager === 'bun' ||\n declaredManager === 'pnpm' ||\n declaredManager === 'yarn' ||\n declaredManager === 'npm'\n ) {\n return declaredManager\n }\n\n if (await pathExists(path.join(projectRoot, 'bun.lock'))) {\n return 'bun'\n }\n\n if (await pathExists(path.join(projectRoot, 'pnpm-lock.yaml'))) {\n return 'pnpm'\n }\n\n if (await pathExists(path.join(projectRoot, 'yarn.lock'))) {\n return 'yarn'\n }\n\n if (await pathExists(path.join(projectRoot, 'package-lock.json'))) {\n return 'npm'\n }\n\n return 'npm'\n}\n\nfunction buildAddCommand(packageManager: PackageManager, dependencies: string[], dev: boolean) {\n switch (packageManager) {\n case 'bun':\n return ['bun', 'add', ...(dev ? ['-d'] : []), ...dependencies]\n case 'pnpm':\n return ['pnpm', 'add', ...(dev ? ['-D'] : []), ...dependencies]\n case 'yarn':\n return ['yarn', 'add', ...(dev ? ['-D'] : []), ...dependencies]\n case 'npm':\n return ['npm', 'install', ...(dev ? ['-D'] : []), ...dependencies]\n }\n}\n\nasync function runCommand(commandParts: string[], cwd: string) {\n const [command, ...args] = commandParts\n\n if (!command) {\n throw new Error('Missing command')\n }\n\n console.log(`Running: ${commandParts.join(' ')}`)\n\n await new Promise<void>((resolve, reject) => {\n const child = spawn(command, args, { cwd, stdio: 'inherit' })\n\n child.on('error', reject)\n child.on('close', (code) => {\n if (code === 0) {\n resolve()\n return\n }\n\n reject(new Error(`${command} exited with code ${code}`))\n })\n })\n}\n\nfunction getPackageVersion(packageJson: PackageJson, dependencyName: string) {\n const version = packageJson.dependencies?.[dependencyName] ?? packageJson.devDependencies?.[dependencyName]\n\n if (!version) {\n throw new Error(`Unable to find ${dependencyName} version in @uselets/ui package metadata`)\n }\n\n return version\n}\n\nasync function installMissingDependencies(projectRoot: string, projectPackageJson: PackageJson) {\n const packageRoot = await findPackageRoot()\n const packageJson = await readJsonFile<PackageJson>(path.join(packageRoot, 'package.json'))\n const packageManager = await detectPackageManager(projectRoot, projectPackageJson)\n const runtimeDependencies = []\n const devDependencies = []\n\n if (!packageJson.name || !packageJson.version) {\n throw new Error('Unable to resolve @uselets/ui package name and version')\n }\n\n if (!hasDependency(projectPackageJson, packageJson.name)) {\n runtimeDependencies.push(`${packageJson.name}@${packageJson.version}`)\n }\n\n if (!hasDependency(projectPackageJson, '@fontsource-variable/inter')) {\n runtimeDependencies.push(\n `@fontsource-variable/inter@${getPackageVersion(packageJson, '@fontsource-variable/inter')}`\n )\n }\n\n if (!hasDependency(projectPackageJson, 'tailwindcss')) {\n devDependencies.push(`tailwindcss@${getPackageVersion(packageJson, 'tailwindcss')}`)\n }\n\n if (!hasDependency(projectPackageJson, '@tailwindcss/postcss')) {\n devDependencies.push(`@tailwindcss/postcss@${getPackageVersion(packageJson, '@tailwindcss/postcss')}`)\n }\n\n if (runtimeDependencies.length > 0) {\n await runCommand(buildAddCommand(packageManager, runtimeDependencies, false), projectRoot)\n } else {\n console.log('Runtime dependencies already declared.')\n }\n\n if (devDependencies.length > 0) {\n await runCommand(buildAddCommand(packageManager, devDependencies, true), projectRoot)\n } else {\n console.log('Tailwind dependencies already declared.')\n }\n}\n\nasync function installSkill(targets: AgentTarget[]) {\n const packageRoot = await findPackageRoot()\n const sourcePath = path.join(packageRoot, 'skills', SKILL_NAME)\n\n try {\n await fs.access(sourcePath)\n } catch {\n throw new Error(`Bundled skill not found at ${sourcePath}`)\n }\n\n const installedPaths = []\n\n for (const target of targets) {\n const targetPath = path.join(process.cwd(), AGENT_TARGETS[target])\n\n await fs.rm(targetPath, { recursive: true, force: true })\n await fs.mkdir(path.dirname(targetPath), { recursive: true })\n await fs.cp(sourcePath, targetPath, { recursive: true })\n\n installedPaths.push(targetPath)\n }\n\n console.log(`Installed ${SKILL_NAME} skill:`)\n\n for (const installedPath of installedPaths) {\n console.log(`- ${installedPath}`)\n }\n}\n\nasync function createPrompt() {\n return readline.createInterface({ input: process.stdin, output: process.stdout })\n}\n\nasync function promptTheme(defaultTheme: ThemeOption) {\n if (!process.stdin.isTTY) {\n return defaultTheme\n }\n\n const prompt = await createPrompt()\n\n try {\n while (true) {\n const answer = (await prompt.question(`Theme (max/gomax) [${defaultTheme}]: `)).trim().toLowerCase()\n\n if (!answer) {\n return defaultTheme\n }\n\n if (answer === 'max' || answer === 'gomax') {\n return answer\n }\n\n console.log('Please choose \"max\" or \"gomax\".')\n }\n } finally {\n prompt.close()\n }\n}\n\nasync function promptCssPath(defaultCssPath: string) {\n if (!process.stdin.isTTY) {\n return defaultCssPath\n }\n\n const prompt = await createPrompt()\n\n try {\n const answer = (await prompt.question(`Global CSS path [${defaultCssPath}]: `)).trim()\n return answer || defaultCssPath\n } finally {\n prompt.close()\n }\n}\n\nasync function promptInstallSkill() {\n if (!process.stdin.isTTY) {\n return false\n }\n\n const prompt = await createPrompt()\n\n try {\n while (true) {\n const answer = (await prompt.question('Install agent skill? (y/N): ')).trim().toLowerCase()\n\n if (!answer || answer === 'n' || answer === 'no') {\n return false\n }\n\n if (answer === 'y' || answer === 'yes') {\n return true\n }\n\n console.log('Please answer \"y\" or \"n\".')\n }\n } finally {\n prompt.close()\n }\n}\n\nasync function ensurePostcssConfig(projectRoot: string) {\n const postcssPath = path.join(projectRoot, 'postcss.config.mjs')\n\n if (await pathExists(postcssPath)) {\n console.log('Preserved existing postcss.config.mjs.')\n return\n }\n\n await fs.writeFile(postcssPath, POSTCSS_CONFIG)\n console.log('Created postcss.config.mjs.')\n}\n\nfunction buildCssImports(source: string, theme: ThemeOption) {\n const imports = []\n const hasTailwind = /@import\\s+['\"]tailwindcss['\"]/.test(source)\n const hasTheme = /@import\\s+['\"]@uselets\\/ui\\/themes\\/(?:max|gomax)\\.css['\"]/.test(source)\n const hasFont = /@import\\s+['\"]@fontsource-variable\\/inter['\"]/.test(source)\n\n if (!hasTailwind) {\n imports.push(\"@import 'tailwindcss';\")\n }\n\n if (!hasTheme) {\n imports.push(`@import '@uselets/ui/themes/${theme}.css';`)\n }\n\n if (!hasFont) {\n imports.push(\"@import '@fontsource-variable/inter';\")\n }\n\n return { imports, hasTheme }\n}\n\nasync function ensureGlobalCss(projectRoot: string, cssPath: string, theme: ThemeOption) {\n const absoluteCssPath = path.resolve(projectRoot, cssPath)\n const existingSource = (await pathExists(absoluteCssPath)) ? await fs.readFile(absoluteCssPath, 'utf8') : ''\n const { imports, hasTheme } = buildCssImports(existingSource, theme)\n\n if (hasTheme) {\n console.log('Preserved existing @uselets/ui theme import.')\n }\n\n if (imports.length === 0) {\n console.log(`Global CSS already configured at ${cssPath}.`)\n return\n }\n\n const separator = existingSource.length > 0 && !existingSource.startsWith('\\n') ? '\\n' : ''\n const updatedSource = `${imports.join('\\n')}${separator}${existingSource}`\n\n await fs.mkdir(path.dirname(absoluteCssPath), { recursive: true })\n await fs.writeFile(absoluteCssPath, updatedSource)\n console.log(`Updated global CSS at ${cssPath}.`)\n}\n\nasync function initProject(options: InitOptions) {\n const projectRoot = process.cwd()\n const packageJsonPath = path.join(projectRoot, 'package.json')\n\n if (!(await pathExists(packageJsonPath))) {\n throw new Error('No package.json found in the current directory. Run uselets init from your project root.')\n }\n\n const projectPackageJson = await readJsonFile<PackageJson>(packageJsonPath)\n const theme = options.theme ?? (await promptTheme('max'))\n const cssPath = options.css ?? (await promptCssPath(DEFAULT_CSS_PATH))\n const shouldInstallSkill = options.installSkill ?? (await promptInstallSkill())\n\n await installMissingDependencies(projectRoot, projectPackageJson)\n await ensurePostcssConfig(projectRoot)\n await ensureGlobalCss(projectRoot, cssPath, theme)\n\n if (shouldInstallSkill) {\n await installSkill(ALL_AGENT_TARGETS)\n }\n}\n\nasync function main() {\n const program = new Command()\n\n program.name('uselets').description('CLI for @uselets/ui').showHelpAfterError()\n\n program\n .command('skill')\n .description(`Reinstall the ${SKILL_NAME} agent skill`)\n .addOption(\n new Option('--agent <agent>', 'Target agent directory').choices(['codex', 'claude', 'all']).default('all')\n )\n .action(async (options: { agent: AgentOption }) => {\n await installSkill(resolveTargets(options.agent))\n })\n\n program\n .command('init')\n .description('Set up @uselets/ui in this project')\n .addOption(new Option('--theme <theme>', 'Theme to import').choices(['max', 'gomax']))\n .option('--css <path>', 'Global CSS file path')\n .option('--install-skill', 'Install the agent skill without prompting')\n .option('--no-install-skill', 'Skip the agent skill prompt and installation')\n .action(async (options: InitOptions) => {\n await initProject(options)\n })\n\n if (process.argv.length <= 2) {\n program.outputHelp()\n return\n }\n\n await program.parseAsync()\n}\n\nmain().catch((error: unknown) => {\n console.error(error instanceof Error ? error.message : error)\n process.exitCode = 1\n})\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"uselets.mjs","names":[],"sources":["../../src/cli/uselets.ts"],"sourcesContent":["#!/usr/bin/env node\n\nimport { spawn } from 'node:child_process'\nimport fs from 'node:fs/promises'\nimport path from 'node:path'\nimport readline from 'node:readline/promises'\nimport { fileURLToPath } from 'node:url'\n\nimport { Command, Option } from 'commander'\n\nconst SKILL_NAME = 'uselets-ui'\nconst DEFAULT_CSS_PATH = 'src/styles/globals.css'\nconst POSTCSS_CONFIG = \"export { default } from '@uselets/ui/postcss.config'\\n\"\nconst AGENT_TARGETS = {\n codex: path.join('.agents', 'skills', SKILL_NAME),\n claude: path.join('.claude', 'skills', SKILL_NAME)\n} as const\n\ntype AgentTarget = keyof typeof AGENT_TARGETS\ntype AgentOption = AgentTarget | 'all'\ntype ThemeOption = 'max' | 'gomax'\ntype PackageManager = 'bun' | 'pnpm' | 'yarn' | 'npm'\ntype PackageJson = {\n name?: string\n version?: string\n packageManager?: string\n dependencies?: Record<string, string>\n devDependencies?: Record<string, string>\n peerDependencies?: Record<string, string>\n optionalDependencies?: Record<string, string>\n}\ntype InitOptions = {\n theme?: ThemeOption\n css?: string\n installSkill?: boolean\n}\n\nconst ALL_AGENT_TARGETS = Object.keys(AGENT_TARGETS) as AgentTarget[]\n\nasync function pathExists(targetPath: string) {\n try {\n await fs.access(targetPath)\n return true\n } catch {\n return false\n }\n}\n\nasync function readJsonFile<T>(filePath: string) {\n return JSON.parse(await fs.readFile(filePath, 'utf8')) as T\n}\n\nasync function findPackageRoot() {\n let currentDir = fileURLToPath(new URL('.', import.meta.url))\n\n while (true) {\n try {\n await fs.access(path.join(currentDir, 'package.json'))\n return currentDir\n } catch {\n const parentDir = path.dirname(currentDir)\n\n if (parentDir === currentDir) {\n throw new Error('Unable to resolve @uselets/ui package root')\n }\n\n currentDir = parentDir\n }\n }\n}\n\nfunction resolveTargets(agent: AgentOption) {\n return agent === 'all' ? ALL_AGENT_TARGETS : [agent]\n}\n\nfunction hasDependency(packageJson: PackageJson, dependencyName: string) {\n return Boolean(\n packageJson.dependencies?.[dependencyName] ||\n packageJson.devDependencies?.[dependencyName] ||\n packageJson.peerDependencies?.[dependencyName] ||\n packageJson.optionalDependencies?.[dependencyName]\n )\n}\n\nasync function detectPackageManager(projectRoot: string, packageJson: PackageJson): Promise<PackageManager> {\n const declaredManager = packageJson.packageManager?.split('@')[0]\n\n if (\n declaredManager === 'bun' ||\n declaredManager === 'pnpm' ||\n declaredManager === 'yarn' ||\n declaredManager === 'npm'\n ) {\n return declaredManager\n }\n\n if (await pathExists(path.join(projectRoot, 'bun.lock'))) {\n return 'bun'\n }\n\n if (await pathExists(path.join(projectRoot, 'pnpm-lock.yaml'))) {\n return 'pnpm'\n }\n\n if (await pathExists(path.join(projectRoot, 'yarn.lock'))) {\n return 'yarn'\n }\n\n if (await pathExists(path.join(projectRoot, 'package-lock.json'))) {\n return 'npm'\n }\n\n return 'npm'\n}\n\nfunction buildAddCommand(packageManager: PackageManager, dependencies: string[], dev: boolean) {\n switch (packageManager) {\n case 'bun':\n return ['bun', 'add', ...(dev ? ['-d'] : []), ...dependencies]\n case 'pnpm':\n return ['pnpm', 'add', ...(dev ? ['-D'] : []), ...dependencies]\n case 'yarn':\n return ['yarn', 'add', ...(dev ? ['-D'] : []), ...dependencies]\n case 'npm':\n return ['npm', 'install', ...(dev ? ['-D'] : []), ...dependencies]\n }\n}\n\nasync function runCommand(commandParts: string[], cwd: string) {\n const [command, ...args] = commandParts\n\n if (!command) {\n throw new Error('Missing command')\n }\n\n console.log(`Running: ${commandParts.join(' ')}`)\n\n await new Promise<void>((resolve, reject) => {\n const child = spawn(command, args, { cwd, stdio: 'inherit' })\n\n child.on('error', reject)\n child.on('close', (code) => {\n if (code === 0) {\n resolve()\n return\n }\n\n reject(new Error(`${command} exited with code ${code}`))\n })\n })\n}\n\nfunction getPackageVersion(packageJson: PackageJson, dependencyName: string) {\n const version = packageJson.dependencies?.[dependencyName] ?? packageJson.devDependencies?.[dependencyName]\n\n if (!version) {\n throw new Error(`Unable to find ${dependencyName} version in @uselets/ui package metadata`)\n }\n\n return version\n}\n\nasync function installMissingDependencies(projectRoot: string, projectPackageJson: PackageJson) {\n const packageRoot = await findPackageRoot()\n const packageJson = await readJsonFile<PackageJson>(path.join(packageRoot, 'package.json'))\n const packageManager = await detectPackageManager(projectRoot, projectPackageJson)\n const runtimeDependencies = []\n const devDependencies = []\n\n if (!packageJson.name || !packageJson.version) {\n throw new Error('Unable to resolve @uselets/ui package name and version')\n }\n\n if (!hasDependency(projectPackageJson, packageJson.name)) {\n runtimeDependencies.push(`${packageJson.name}@${packageJson.version}`)\n }\n\n if (!hasDependency(projectPackageJson, '@fontsource-variable/inter')) {\n runtimeDependencies.push(\n `@fontsource-variable/inter@${getPackageVersion(packageJson, '@fontsource-variable/inter')}`\n )\n }\n\n if (!hasDependency(projectPackageJson, 'tailwindcss')) {\n devDependencies.push(`tailwindcss@${getPackageVersion(packageJson, 'tailwindcss')}`)\n }\n\n if (!hasDependency(projectPackageJson, '@tailwindcss/postcss')) {\n devDependencies.push(`@tailwindcss/postcss@${getPackageVersion(packageJson, '@tailwindcss/postcss')}`)\n }\n\n if (runtimeDependencies.length > 0) {\n await runCommand(buildAddCommand(packageManager, runtimeDependencies, false), projectRoot)\n } else {\n console.log('Runtime dependencies already declared.')\n }\n\n if (devDependencies.length > 0) {\n await runCommand(buildAddCommand(packageManager, devDependencies, true), projectRoot)\n } else {\n console.log('Tailwind dependencies already declared.')\n }\n}\n\nasync function installSkill(targets: AgentTarget[]) {\n const packageRoot = await findPackageRoot()\n const sourcePath = path.join(packageRoot, 'skills', SKILL_NAME)\n\n try {\n await fs.access(sourcePath)\n } catch {\n throw new Error(`Bundled skill not found at ${sourcePath}`)\n }\n\n const installedPaths = []\n\n for (const target of targets) {\n const targetPath = path.join(process.cwd(), AGENT_TARGETS[target])\n\n await fs.rm(targetPath, { recursive: true, force: true })\n await fs.mkdir(path.dirname(targetPath), { recursive: true })\n await fs.cp(sourcePath, targetPath, { recursive: true })\n\n installedPaths.push(targetPath)\n }\n\n console.log(`Installed ${SKILL_NAME} skill:`)\n\n for (const installedPath of installedPaths) {\n console.log(`- ${installedPath}`)\n }\n}\n\nasync function createPrompt() {\n return readline.createInterface({ input: process.stdin, output: process.stdout })\n}\n\nasync function promptTheme(defaultTheme: ThemeOption) {\n if (!process.stdin.isTTY) {\n return defaultTheme\n }\n\n const prompt = await createPrompt()\n\n try {\n while (true) {\n const answer = (await prompt.question(`Theme (max/gomax) [${defaultTheme}]: `)).trim().toLowerCase()\n\n if (!answer) {\n return defaultTheme\n }\n\n if (answer === 'max' || answer === 'gomax') {\n return answer\n }\n\n console.log('Please choose \"max\" or \"gomax\".')\n }\n } finally {\n prompt.close()\n }\n}\n\nasync function promptCssPath(defaultCssPath: string) {\n if (!process.stdin.isTTY) {\n return defaultCssPath\n }\n\n const prompt = await createPrompt()\n\n try {\n const answer = (await prompt.question(`Global CSS path [${defaultCssPath}]: `)).trim()\n return answer || defaultCssPath\n } finally {\n prompt.close()\n }\n}\n\nasync function promptInstallSkill() {\n if (!process.stdin.isTTY) {\n return false\n }\n\n const prompt = await createPrompt()\n\n try {\n while (true) {\n const answer = (await prompt.question('Install agent skill? (y/N): ')).trim().toLowerCase()\n\n if (!answer || answer === 'n' || answer === 'no') {\n return false\n }\n\n if (answer === 'y' || answer === 'yes') {\n return true\n }\n\n console.log('Please answer \"y\" or \"n\".')\n }\n } finally {\n prompt.close()\n }\n}\n\nasync function ensurePostcssConfig(projectRoot: string) {\n const postcssPath = path.join(projectRoot, 'postcss.config.mjs')\n\n if (await pathExists(postcssPath)) {\n console.log('Preserved existing postcss.config.mjs.')\n return\n }\n\n await fs.writeFile(postcssPath, POSTCSS_CONFIG)\n console.log('Created postcss.config.mjs.')\n}\n\nfunction buildPackageSource(cssPath: string) {\n const cssDir = path.posix.dirname(cssPath.replaceAll(path.sep, path.posix.sep))\n const relativeSource = path.posix.relative(cssDir, 'node_modules/@uselets/ui/dist')\n\n return relativeSource.startsWith('.') ? relativeSource : `./${relativeSource}`\n}\n\nfunction buildCssImports(source: string, theme: ThemeOption, cssPath: string) {\n const imports = []\n const hasTailwind = /@import\\s+['\"]tailwindcss['\"]/.test(source)\n const hasTheme = /@import\\s+['\"]@uselets\\/ui\\/themes\\/(?:max|gomax)\\.css['\"]/.test(source)\n const hasFont = /@import\\s+['\"]@fontsource-variable\\/inter['\"]/.test(source)\n const hasPackageSource = /@source\\s+['\"][^'\"]*@uselets\\/ui\\/dist['\"]/.test(source)\n\n if (!hasTailwind) {\n imports.push(\"@import 'tailwindcss';\")\n }\n\n if (!hasTheme) {\n imports.push(`@import '@uselets/ui/themes/${theme}.css';`)\n }\n\n if (!hasFont) {\n imports.push(\"@import '@fontsource-variable/inter';\")\n }\n\n if (!hasPackageSource) {\n imports.push(`@source '${buildPackageSource(cssPath)}';`)\n }\n\n return { imports, hasTheme }\n}\n\nasync function ensureGlobalCss(projectRoot: string, cssPath: string, theme: ThemeOption) {\n const absoluteCssPath = path.resolve(projectRoot, cssPath)\n const existingSource = (await pathExists(absoluteCssPath)) ? await fs.readFile(absoluteCssPath, 'utf8') : ''\n const { imports, hasTheme } = buildCssImports(existingSource, theme, cssPath)\n\n if (hasTheme) {\n console.log('Preserved existing @uselets/ui theme import.')\n }\n\n if (imports.length === 0) {\n console.log(`Global CSS already configured at ${cssPath}.`)\n return\n }\n\n const separator = existingSource.length > 0 && !existingSource.startsWith('\\n') ? '\\n' : ''\n const updatedSource = `${imports.join('\\n')}${separator}${existingSource}`\n\n await fs.mkdir(path.dirname(absoluteCssPath), { recursive: true })\n await fs.writeFile(absoluteCssPath, updatedSource)\n console.log(`Updated global CSS at ${cssPath}.`)\n}\n\nasync function initProject(options: InitOptions) {\n const projectRoot = process.cwd()\n const packageJsonPath = path.join(projectRoot, 'package.json')\n\n if (!(await pathExists(packageJsonPath))) {\n throw new Error('No package.json found in the current directory. Run uselets init from your project root.')\n }\n\n const projectPackageJson = await readJsonFile<PackageJson>(packageJsonPath)\n const theme = options.theme ?? (await promptTheme('max'))\n const cssPath = options.css ?? (await promptCssPath(DEFAULT_CSS_PATH))\n const shouldInstallSkill = options.installSkill ?? (await promptInstallSkill())\n\n await installMissingDependencies(projectRoot, projectPackageJson)\n await ensurePostcssConfig(projectRoot)\n await ensureGlobalCss(projectRoot, cssPath, theme)\n\n if (shouldInstallSkill) {\n await installSkill(ALL_AGENT_TARGETS)\n }\n}\n\nasync function main() {\n const program = new Command()\n\n program.name('uselets').description('CLI for @uselets/ui').showHelpAfterError()\n\n program\n .command('skill')\n .description(`Reinstall the ${SKILL_NAME} agent skill`)\n .addOption(\n new Option('--agent <agent>', 'Target agent directory').choices(['codex', 'claude', 'all']).default('all')\n )\n .action(async (options: { agent: AgentOption }) => {\n await installSkill(resolveTargets(options.agent))\n })\n\n program\n .command('init')\n .description('Set up @uselets/ui in this project')\n .addOption(new Option('--theme <theme>', 'Theme to import').choices(['max', 'gomax']))\n .option('--css <path>', 'Global CSS file path')\n .option('--install-skill', 'Install the agent skill without prompting')\n .option('--no-install-skill', 'Skip the agent skill prompt and installation')\n .action(async (options: InitOptions) => {\n await initProject(options)\n })\n\n if (process.argv.length <= 2) {\n program.outputHelp()\n return\n }\n\n await program.parseAsync()\n}\n\nmain().catch((error: unknown) => {\n console.error(error instanceof Error ? error.message : error)\n process.exitCode = 1\n})\n"],"mappings":"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"}
|
package/dist/components/card.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import"../chunk-CHh1Zzun.js";import{cn as e}from"../lib/utils.js";import{jsx as t}from"react/jsx-runtime";function Card({className:n,size:r=`md`,...i}){return t(`div`,{"data-slot":`card`,"data-size":r,className:e(`group/card flex flex-col gap-4 overflow-hidden rounded-xl py-4 text-sm bg-card text-card-foreground ring-foreground/10 ring-1`,`has-data-[slot=card-footer]:pb-0 has-[>img:first-child]:pt-0`,`data-[size=sm]:gap-3 data-[size=sm]:py-3 data-[size=sm]:has-data-[slot=card-footer]:pb-0`,`*:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl`,n),...i})}function CardHeader({className:n,...r}){return t(`div`,{"data-slot":`card-header`,className:e(`group/card-header @container/card-header grid auto-rows-min items-start gap-1 rounded-t-xl px-4`,`group-data-[size=sm]/card:px-3 [.border-b]:pb-4 group-data-[size=sm]/card:[.border-b]:pb-3`,`has-data-[slot=card-action]:grid-cols-[1fr_auto] has-data-[slot=card-description]:grid-rows-[auto_auto]`,n),...r})}function CardTitle({className:n,...r}){return t(`div`,{"data-slot":`card-title`,className:e(`text-
|
|
1
|
+
import"../chunk-CHh1Zzun.js";import{cn as e}from"../lib/utils.js";import{jsx as t}from"react/jsx-runtime";function Card({className:n,size:r=`md`,...i}){return t(`div`,{"data-slot":`card`,"data-size":r,className:e(`group/card flex flex-col gap-4 overflow-hidden rounded-xl py-4 text-sm bg-card text-card-foreground ring-foreground/10 ring-1`,`has-data-[slot=card-footer]:pb-0 has-[>img:first-child]:pt-0`,`data-[size=sm]:gap-3 data-[size=sm]:py-3 data-[size=sm]:has-data-[slot=card-footer]:pb-0`,`*:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl`,n),...i})}function CardHeader({className:n,...r}){return t(`div`,{"data-slot":`card-header`,className:e(`group/card-header @container/card-header grid auto-rows-min items-start gap-1 rounded-t-xl px-4`,`group-data-[size=sm]/card:px-3 [.border-b]:pb-4 group-data-[size=sm]/card:[.border-b]:pb-3`,`has-data-[slot=card-action]:grid-cols-[1fr_auto] has-data-[slot=card-description]:grid-rows-[auto_auto]`,n),...r})}function CardTitle({className:n,...r}){return t(`div`,{"data-slot":`card-title`,className:e(`text-lg leading-snug font-bold group-data-[size=sm]/card:text-sm`,n),...r})}function CardDescription({className:n,...r}){return t(`div`,{"data-slot":`card-description`,className:e(`text-muted-foreground text-sm`,n),...r})}function CardAction({className:n,...r}){return t(`div`,{"data-slot":`card-action`,className:e(`col-start-2 row-span-2 row-start-1 self-start justify-self-end`,n),...r})}function CardContent({className:n,...r}){return t(`div`,{"data-slot":`card-content`,className:e(`px-4 group-data-[size=sm]/card:px-3`,n),...r})}function CardFooter({className:n,...r}){return t(`div`,{"data-slot":`card-footer`,className:e(`bg-muted/50 flex items-center rounded-b-xl border-t p-4`,`group-data-[size=sm]/card:p-3`,n),...r})}export{Card,CardAction,CardContent,CardDescription,CardFooter,CardHeader,CardTitle};
|
|
2
2
|
//# sourceMappingURL=card.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"card.js","names":[],"sources":["../../src/components/card.tsx"],"sourcesContent":["import type * as React from 'react'\n\nimport { cn } from '../lib/utils'\n\nexport type CardProps = React.ComponentProps<'div'> & { size?: 'sm' | 'md' }\n\nexport type CardHeaderProps = React.ComponentProps<'div'>\n\nexport type CardTitleProps = React.ComponentProps<'div'>\n\nexport type CardDescriptionProps = React.ComponentProps<'div'>\n\nexport type CardActionProps = React.ComponentProps<'div'>\n\nexport type CardContentProps = React.ComponentProps<'div'>\n\nexport type CardFooterProps = React.ComponentProps<'div'>\n\nfunction Card({ className, size = 'md', ...props }: CardProps) {\n return (\n <div\n data-slot=\"card\"\n data-size={size}\n className={cn(\n 'group/card flex flex-col gap-4 overflow-hidden rounded-xl py-4 text-sm bg-card text-card-foreground ring-foreground/10 ring-1',\n 'has-data-[slot=card-footer]:pb-0 has-[>img:first-child]:pt-0',\n 'data-[size=sm]:gap-3 data-[size=sm]:py-3 data-[size=sm]:has-data-[slot=card-footer]:pb-0',\n '*:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction CardHeader({ className, ...props }: CardHeaderProps) {\n return (\n <div\n data-slot=\"card-header\"\n className={cn(\n 'group/card-header @container/card-header grid auto-rows-min items-start gap-1 rounded-t-xl px-4',\n 'group-data-[size=sm]/card:px-3 [.border-b]:pb-4 group-data-[size=sm]/card:[.border-b]:pb-3',\n 'has-data-[slot=card-action]:grid-cols-[1fr_auto] has-data-[slot=card-description]:grid-rows-[auto_auto]',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction CardTitle({ className, ...props }: CardTitleProps) {\n return (\n <div\n data-slot=\"card-title\"\n className={cn('text-
|
|
1
|
+
{"version":3,"file":"card.js","names":[],"sources":["../../src/components/card.tsx"],"sourcesContent":["import type * as React from 'react'\n\nimport { cn } from '../lib/utils'\n\nexport type CardProps = React.ComponentProps<'div'> & { size?: 'sm' | 'md' }\n\nexport type CardHeaderProps = React.ComponentProps<'div'>\n\nexport type CardTitleProps = React.ComponentProps<'div'>\n\nexport type CardDescriptionProps = React.ComponentProps<'div'>\n\nexport type CardActionProps = React.ComponentProps<'div'>\n\nexport type CardContentProps = React.ComponentProps<'div'>\n\nexport type CardFooterProps = React.ComponentProps<'div'>\n\nfunction Card({ className, size = 'md', ...props }: CardProps) {\n return (\n <div\n data-slot=\"card\"\n data-size={size}\n className={cn(\n 'group/card flex flex-col gap-4 overflow-hidden rounded-xl py-4 text-sm bg-card text-card-foreground ring-foreground/10 ring-1',\n 'has-data-[slot=card-footer]:pb-0 has-[>img:first-child]:pt-0',\n 'data-[size=sm]:gap-3 data-[size=sm]:py-3 data-[size=sm]:has-data-[slot=card-footer]:pb-0',\n '*:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction CardHeader({ className, ...props }: CardHeaderProps) {\n return (\n <div\n data-slot=\"card-header\"\n className={cn(\n 'group/card-header @container/card-header grid auto-rows-min items-start gap-1 rounded-t-xl px-4',\n 'group-data-[size=sm]/card:px-3 [.border-b]:pb-4 group-data-[size=sm]/card:[.border-b]:pb-3',\n 'has-data-[slot=card-action]:grid-cols-[1fr_auto] has-data-[slot=card-description]:grid-rows-[auto_auto]',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction CardTitle({ className, ...props }: CardTitleProps) {\n return (\n <div\n data-slot=\"card-title\"\n className={cn('text-lg leading-snug font-bold group-data-[size=sm]/card:text-sm', className)}\n {...props}\n />\n )\n}\n\nfunction CardDescription({ className, ...props }: CardDescriptionProps) {\n return <div data-slot=\"card-description\" className={cn('text-muted-foreground text-sm', className)} {...props} />\n}\n\nfunction CardAction({ className, ...props }: CardActionProps) {\n return (\n <div\n data-slot=\"card-action\"\n className={cn('col-start-2 row-span-2 row-start-1 self-start justify-self-end', className)}\n {...props}\n />\n )\n}\n\nfunction CardContent({ className, ...props }: CardContentProps) {\n return <div data-slot=\"card-content\" className={cn('px-4 group-data-[size=sm]/card:px-3', className)} {...props} />\n}\n\nfunction CardFooter({ className, ...props }: CardFooterProps) {\n return (\n <div\n data-slot=\"card-footer\"\n className={cn(\n 'bg-muted/50 flex items-center rounded-b-xl border-t p-4',\n 'group-data-[size=sm]/card:p-3',\n className\n )}\n {...props}\n />\n )\n}\n\nexport { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle }\n"],"mappings":"0GAkBA,SAAS,KAAK,CAAE,YAAW,OAAO,KAAM,GAAG,GAAoB,CAC7D,OACE,EAAC,MAAD,CACE,YAAU,OACV,YAAW,EACX,UAAW,EACT,gIACA,+DACA,2FACA,mEACA,EACD,CACD,GAAI,EACJ,CAAA,CAIN,SAAS,WAAW,CAAE,YAAW,GAAG,GAA0B,CAC5D,OACE,EAAC,MAAD,CACE,YAAU,cACV,UAAW,EACT,kGACA,6FACA,0GACA,EACD,CACD,GAAI,EACJ,CAAA,CAIN,SAAS,UAAU,CAAE,YAAW,GAAG,GAAyB,CAC1D,OACE,EAAC,MAAD,CACE,YAAU,aACV,UAAW,EAAG,mEAAoE,EAAU,CAC5F,GAAI,EACJ,CAAA,CAIN,SAAS,gBAAgB,CAAE,YAAW,GAAG,GAA+B,CACtE,OAAO,EAAC,MAAD,CAAK,YAAU,mBAAmB,UAAW,EAAG,gCAAiC,EAAU,CAAE,GAAI,EAAS,CAAA,CAGnH,SAAS,WAAW,CAAE,YAAW,GAAG,GAA0B,CAC5D,OACE,EAAC,MAAD,CACE,YAAU,cACV,UAAW,EAAG,iEAAkE,EAAU,CAC1F,GAAI,EACJ,CAAA,CAIN,SAAS,YAAY,CAAE,YAAW,GAAG,GAA2B,CAC9D,OAAO,EAAC,MAAD,CAAK,YAAU,eAAe,UAAW,EAAG,sCAAuC,EAAU,CAAE,GAAI,EAAS,CAAA,CAGrH,SAAS,WAAW,CAAE,YAAW,GAAG,GAA0B,CAC5D,OACE,EAAC,MAAD,CACE,YAAU,cACV,UAAW,EACT,0DACA,gCACA,EACD,CACD,GAAI,EACJ,CAAA"}
|
|
@@ -16,7 +16,9 @@ type ComboboxInputProps = Combobox$1.Input.Props & {
|
|
|
16
16
|
showTrigger?: boolean;
|
|
17
17
|
showClear?: boolean;
|
|
18
18
|
};
|
|
19
|
-
type ComboboxContentProps = Combobox$1.Popup.Props & Pick<Combobox$1.Positioner.Props, 'side' | 'align' | 'sideOffset' | 'alignOffset' | 'anchor'
|
|
19
|
+
type ComboboxContentProps = Combobox$1.Popup.Props & Pick<Combobox$1.Positioner.Props, 'side' | 'align' | 'sideOffset' | 'alignOffset' | 'anchor'> & {
|
|
20
|
+
container?: Combobox$1.Portal.Props['container'];
|
|
21
|
+
};
|
|
20
22
|
type ComboboxListProps = Combobox$1.List.Props;
|
|
21
23
|
type ComboboxItemProps = Combobox$1.Item.Props;
|
|
22
24
|
type ComboboxGroupProps = Combobox$1.Group.Props;
|
|
@@ -60,6 +62,7 @@ declare function ComboboxContent({
|
|
|
60
62
|
align,
|
|
61
63
|
alignOffset,
|
|
62
64
|
anchor,
|
|
65
|
+
container,
|
|
63
66
|
...props
|
|
64
67
|
}: ComboboxContentProps): _$react_jsx_runtime0.JSX.Element;
|
|
65
68
|
declare function ComboboxList({
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import"../chunk-CHh1Zzun.js";import{cn as e}from"../lib/utils.js";import{Button as t}from"./button.js";import{InputGroup as n,InputGroupAddon as r,InputGroupButton as i,InputGroupInput as a}from"./input-group.js";import{IconCheck as o,IconSelector as s,IconX as c}from"@tabler/icons-react";import{jsx as l,jsxs as u}from"react/jsx-runtime";import*as d from"react";import{Combobox as f}from"@base-ui/react";const p=f.Root;function ComboboxValue({...e}){return l(f.Value,{"data-slot":`combobox-value`,...e})}function ComboboxTrigger({className:t,children:n,icon:r=l(s,{className:`pointer-events-none size-4 text-muted-foreground`}),...i}){return u(f.Trigger,{"data-slot":`combobox-trigger`,className:e(`[&_svg:not([class*='size-'])]:size-4`,t),...i,children:[n,r]})}function ComboboxClear({className:t,...n}){return l(f.Clear,{"data-slot":`combobox-clear`,render:l(i,{variant:`ghost`,size:`icon-xs`}),className:e(t),...n,children:l(c,{className:`pointer-events-none`})})}function ComboboxInput({className:t,children:o,disabled:s=!1,icon:c,showTrigger:d=!0,showClear:p=!1,triggerIcon:m,...h}){return u(n,{className:e(`w-auto`,t),children:[c&&l(r,{align:`inline-start`,children:c}),l(f.Input,{render:l(a,{disabled:s}),...h}),u(r,{align:`inline-end`,children:[d&&l(i,{size:`icon-xs`,variant:`ghost`,asChild:!0,"data-slot":`input-group-button`,className:`group-has-data-[slot=combobox-clear]/input-group:hidden data-pressed:bg-transparent`,disabled:s,children:l(ComboboxTrigger,{icon:m})}),p&&l(ComboboxClear,{disabled:s})]}),o]})}function ComboboxContent({className:t,side:n=`bottom`,sideOffset:r=6,align:i=`start`,alignOffset:a=0,anchor:o,...
|
|
1
|
+
import"../chunk-CHh1Zzun.js";import{cn as e}from"../lib/utils.js";import{Button as t}from"./button.js";import{InputGroup as n,InputGroupAddon as r,InputGroupButton as i,InputGroupInput as a}from"./input-group.js";import{IconCheck as o,IconSelector as s,IconX as c}from"@tabler/icons-react";import{jsx as l,jsxs as u}from"react/jsx-runtime";import*as d from"react";import{Combobox as f}from"@base-ui/react";const p=f.Root;function ComboboxValue({...e}){return l(f.Value,{"data-slot":`combobox-value`,...e})}function ComboboxTrigger({className:t,children:n,icon:r=l(s,{className:`pointer-events-none size-4 text-muted-foreground`}),...i}){return u(f.Trigger,{"data-slot":`combobox-trigger`,className:e(`[&_svg:not([class*='size-'])]:size-4`,t),...i,children:[n,r]})}function ComboboxClear({className:t,...n}){return l(f.Clear,{"data-slot":`combobox-clear`,render:l(i,{variant:`ghost`,size:`icon-xs`}),className:e(t),...n,children:l(c,{className:`pointer-events-none`})})}function ComboboxInput({className:t,children:o,disabled:s=!1,icon:c,showTrigger:d=!0,showClear:p=!1,triggerIcon:m,...h}){return u(n,{className:e(`w-auto`,t),children:[c&&l(r,{align:`inline-start`,children:c}),l(f.Input,{render:l(a,{disabled:s}),...h}),u(r,{align:`inline-end`,children:[d&&l(i,{size:`icon-xs`,variant:`ghost`,asChild:!0,"data-slot":`input-group-button`,className:`group-has-data-[slot=combobox-clear]/input-group:hidden data-pressed:bg-transparent`,disabled:s,children:l(ComboboxTrigger,{icon:m})}),p&&l(ComboboxClear,{disabled:s})]}),o]})}function ComboboxContent({className:t,side:n=`bottom`,sideOffset:r=6,align:i=`start`,alignOffset:a=0,anchor:o,container:s,...c}){return l(f.Portal,{container:s,className:`absolute`,children:l(f.Positioner,{side:n,sideOffset:r,align:i,alignOffset:a,anchor:o,className:`isolate z-50`,children:l(f.Popup,{"data-slot":`combobox-content`,"data-chips":!!o,className:e(`group/combobox-content max-h-(--available-height) w-(--anchor-width) max-w-(--available-width) min-w-[calc(var(--anchor-width)+--spacing(7))] origin-(--transform-origin) overflow-hidden rounded-lg text-popover-foreground shadow-md ring-1 ring-foreground/10 duration-100 data-[chips=true]:min-w-(--anchor-width) data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 *:data-[slot=input-group]:m-1 *:data-[slot=input-group]:mb-0 *:data-[slot=input-group]:h-8 *:data-[slot=input-group]:border-input/30 *:data-[slot=input-group]:bg-input/30 *:data-[slot=input-group]:shadow-none data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95 animate-none! relative bg-popover/70 before:pointer-events-none before:absolute before:inset-0 before:-z-1 before:rounded-[inherit] before:backdrop-blur-2xl before:backdrop-saturate-150 **:data-[slot$=-item]:focus:bg-foreground/10 **:data-[slot$=-item]:data-highlighted:bg-foreground/10 **:data-[slot$=-separator]:bg-foreground/5 **:data-[slot$=-trigger]:focus:bg-foreground/10 **:data-[slot$=-trigger]:aria-expanded:bg-foreground/10! **:data-[variant=destructive]:focus:bg-foreground/10! **:data-[variant=destructive]:text-accent-foreground! **:data-[variant=destructive]:**:text-accent-foreground!`,t),...c})})})}function ComboboxList({className:t,...n}){return l(f.List,{"data-slot":`combobox-list`,className:e(`no-scrollbar max-h-[min(calc(--spacing(72)---spacing(9)),calc(var(--available-height)---spacing(9)))] scroll-py-1 overflow-y-auto overscroll-contain p-1 data-empty:p-0`,t),...n})}function ComboboxItem({className:t,children:n,...r}){return u(f.Item,{"data-slot":`combobox-item`,className:e(`relative flex w-full cursor-default items-center gap-2 rounded-md py-1 pr-8 pl-1.5 text-sm outline-hidden select-none data-highlighted:bg-accent data-highlighted:text-accent-foreground not-data-[variant=destructive]:data-highlighted:**:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4`,t),...r,children:[n,l(f.ItemIndicator,{render:l(`span`,{className:`pointer-events-none absolute right-2 flex size-4 items-center justify-center`}),children:l(o,{className:`pointer-events-none`})})]})}function ComboboxGroup({className:t,...n}){return l(f.Group,{"data-slot":`combobox-group`,className:e(t),...n})}function ComboboxLabel({className:t,...n}){return l(f.GroupLabel,{"data-slot":`combobox-label`,className:e(`px-2 py-1.5 text-xs text-muted-foreground`,t),...n})}function ComboboxCollection({...e}){return l(f.Collection,{"data-slot":`combobox-collection`,...e})}function ComboboxEmpty({className:t,...n}){return l(f.Empty,{"data-slot":`combobox-empty`,className:e(`hidden w-full justify-center py-2 text-center text-sm text-muted-foreground group-data-empty/combobox-content:flex`,t),...n})}function ComboboxSeparator({className:t,...n}){return l(f.Separator,{"data-slot":`combobox-separator`,className:e(`-mx-1 my-1 h-px bg-border`,t),...n})}function ComboboxChips({className:t,...n}){return l(f.Chips,{"data-slot":`combobox-chips`,className:e(`flex min-h-8 flex-wrap items-center gap-1 rounded-lg border border-input bg-transparent bg-clip-padding px-2.5 py-1 text-sm transition-colors focus-within:border-ring focus-within:ring-3 focus-within:ring-ring/50 has-aria-invalid:border-destructive has-aria-invalid:ring-3 has-aria-invalid:ring-destructive/20 has-data-[slot=combobox-chip]:px-1 dark:bg-input/30 dark:has-aria-invalid:border-destructive/50 dark:has-aria-invalid:ring-destructive/40`,t),...n})}function ComboboxChip({className:n,children:r,showRemove:i=!0,...a}){return u(f.Chip,{"data-slot":`combobox-chip`,className:e(`flex h-[calc(--spacing(5.25))] w-fit items-center justify-center gap-1 rounded-sm bg-muted px-1.5 text-xs font-medium whitespace-nowrap text-foreground has-disabled:pointer-events-none has-disabled:cursor-not-allowed has-disabled:opacity-50 has-data-[slot=combobox-chip-remove]:pr-0`,n),...a,children:[r,i&&l(f.ChipRemove,{render:l(t,{variant:`ghost`,color:`zinc`,size:`icon-xs`}),className:`-ml-1 opacity-50 hover:opacity-100`,"data-slot":`combobox-chip-remove`,children:l(c,{className:`pointer-events-none`})})]})}function ComboboxChipsInput({className:t,...n}){return l(f.Input,{"data-slot":`combobox-chip-input`,className:e(`min-w-16 flex-1 outline-none`,t),...n})}function useComboboxAnchor(){return d.useRef(null)}export{p as Combobox,ComboboxChip,ComboboxChips,ComboboxChipsInput,ComboboxClear,ComboboxCollection,ComboboxContent,ComboboxEmpty,ComboboxGroup,ComboboxInput,ComboboxItem,ComboboxLabel,ComboboxList,ComboboxSeparator,ComboboxTrigger,ComboboxValue,useComboboxAnchor};
|
|
2
2
|
//# sourceMappingURL=combobox.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"combobox.js","names":["ComboboxPrimitive"],"sources":["../../src/components/combobox.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Combobox as ComboboxPrimitive } from '@base-ui/react'\nimport { IconCheck, IconSelector, IconX } from '@tabler/icons-react'\n\nimport { cn } from '../lib/utils'\nimport { Button } from './button'\nimport { InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput } from './input-group'\n\nexport type ComboboxProps = React.ComponentProps<typeof ComboboxPrimitive.Root>\n\nexport type ComboboxValueProps = ComboboxPrimitive.Value.Props\n\nexport type ComboboxTriggerProps = ComboboxPrimitive.Trigger.Props & {\n icon?: React.ReactNode\n}\n\nexport type ComboboxClearProps = ComboboxPrimitive.Clear.Props\n\nexport type ComboboxInputProps = ComboboxPrimitive.Input.Props & {\n icon?: React.ReactNode\n triggerIcon?: React.ReactNode\n showTrigger?: boolean\n showClear?: boolean\n}\n\nexport type ComboboxContentProps = ComboboxPrimitive.Popup.Props &\n Pick<ComboboxPrimitive.Positioner.Props, 'side' | 'align' | 'sideOffset' | 'alignOffset' | 'anchor'>\n\nexport type ComboboxListProps = ComboboxPrimitive.List.Props\n\nexport type ComboboxItemProps = ComboboxPrimitive.Item.Props\n\nexport type ComboboxGroupProps = ComboboxPrimitive.Group.Props\n\nexport type ComboboxLabelProps = ComboboxPrimitive.GroupLabel.Props\n\nexport type ComboboxCollectionProps = ComboboxPrimitive.Collection.Props\n\nexport type ComboboxEmptyProps = ComboboxPrimitive.Empty.Props\n\nexport type ComboboxSeparatorProps = ComboboxPrimitive.Separator.Props\n\nexport type ComboboxChipsProps = React.ComponentPropsWithRef<typeof ComboboxPrimitive.Chips> &\n ComboboxPrimitive.Chips.Props\n\nexport type ComboboxChipProps = ComboboxPrimitive.Chip.Props & {\n showRemove?: boolean\n}\n\nexport type ComboboxChipsInputProps = ComboboxPrimitive.Input.Props\n\nconst Combobox = ComboboxPrimitive.Root\n\nfunction ComboboxValue({ ...props }: ComboboxValueProps) {\n return <ComboboxPrimitive.Value data-slot=\"combobox-value\" {...props} />\n}\n\nfunction ComboboxTrigger({\n className,\n children,\n icon = <IconSelector className=\"pointer-events-none size-4 text-muted-foreground\" />,\n ...props\n}: ComboboxTriggerProps) {\n return (\n <ComboboxPrimitive.Trigger\n data-slot=\"combobox-trigger\"\n className={cn(\"[&_svg:not([class*='size-'])]:size-4\", className)}\n {...props}\n >\n {children}\n {icon}\n </ComboboxPrimitive.Trigger>\n )\n}\n\nfunction ComboboxClear({ className, ...props }: ComboboxClearProps) {\n return (\n <ComboboxPrimitive.Clear\n data-slot=\"combobox-clear\"\n render={<InputGroupButton variant=\"ghost\" size=\"icon-xs\" />}\n className={cn(className)}\n {...props}\n >\n <IconX className=\"pointer-events-none\" />\n </ComboboxPrimitive.Clear>\n )\n}\n\nfunction ComboboxInput({\n className,\n children,\n disabled = false,\n icon,\n showTrigger = true,\n showClear = false,\n triggerIcon,\n ...props\n}: ComboboxInputProps) {\n return (\n <InputGroup className={cn('w-auto', className)}>\n {icon && <InputGroupAddon align=\"inline-start\">{icon}</InputGroupAddon>}\n <ComboboxPrimitive.Input render={<InputGroupInput disabled={disabled} />} {...props} />\n <InputGroupAddon align=\"inline-end\">\n {showTrigger && (\n <InputGroupButton\n size=\"icon-xs\"\n variant=\"ghost\"\n asChild\n data-slot=\"input-group-button\"\n className=\"group-has-data-[slot=combobox-clear]/input-group:hidden data-pressed:bg-transparent\"\n disabled={disabled}\n >\n <ComboboxTrigger icon={triggerIcon} />\n </InputGroupButton>\n )}\n {showClear && <ComboboxClear disabled={disabled} />}\n </InputGroupAddon>\n {children}\n </InputGroup>\n )\n}\n\nfunction ComboboxContent({\n className,\n side = 'bottom',\n sideOffset = 6,\n align = 'start',\n alignOffset = 0,\n anchor,\n ...props\n}: ComboboxContentProps) {\n return (\n <ComboboxPrimitive.Portal>\n <ComboboxPrimitive.Positioner\n side={side}\n sideOffset={sideOffset}\n align={align}\n alignOffset={alignOffset}\n anchor={anchor}\n className=\"isolate z-50\"\n >\n <ComboboxPrimitive.Popup\n data-slot=\"combobox-content\"\n data-chips={!!anchor}\n className={cn(\n 'group/combobox-content max-h-(--available-height) w-(--anchor-width) max-w-(--available-width) min-w-[calc(var(--anchor-width)+--spacing(7))] origin-(--transform-origin) overflow-hidden rounded-lg text-popover-foreground shadow-md ring-1 ring-foreground/10 duration-100 data-[chips=true]:min-w-(--anchor-width) data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 *:data-[slot=input-group]:m-1 *:data-[slot=input-group]:mb-0 *:data-[slot=input-group]:h-8 *:data-[slot=input-group]:border-input/30 *:data-[slot=input-group]:bg-input/30 *:data-[slot=input-group]:shadow-none data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95 animate-none! relative bg-popover/70 before:pointer-events-none before:absolute before:inset-0 before:-z-1 before:rounded-[inherit] before:backdrop-blur-2xl before:backdrop-saturate-150 **:data-[slot$=-item]:focus:bg-foreground/10 **:data-[slot$=-item]:data-highlighted:bg-foreground/10 **:data-[slot$=-separator]:bg-foreground/5 **:data-[slot$=-trigger]:focus:bg-foreground/10 **:data-[slot$=-trigger]:aria-expanded:bg-foreground/10! **:data-[variant=destructive]:focus:bg-foreground/10! **:data-[variant=destructive]:text-accent-foreground! **:data-[variant=destructive]:**:text-accent-foreground!',\n className\n )}\n {...props}\n />\n </ComboboxPrimitive.Positioner>\n </ComboboxPrimitive.Portal>\n )\n}\n\nfunction ComboboxList({ className, ...props }: ComboboxListProps) {\n return (\n <ComboboxPrimitive.List\n data-slot=\"combobox-list\"\n className={cn(\n 'no-scrollbar max-h-[min(calc(--spacing(72)---spacing(9)),calc(var(--available-height)---spacing(9)))] scroll-py-1 overflow-y-auto overscroll-contain p-1 data-empty:p-0',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction ComboboxItem({ className, children, ...props }: ComboboxItemProps) {\n return (\n <ComboboxPrimitive.Item\n data-slot=\"combobox-item\"\n className={cn(\n \"relative flex w-full cursor-default items-center gap-2 rounded-md py-1 pr-8 pl-1.5 text-sm outline-hidden select-none data-highlighted:bg-accent data-highlighted:text-accent-foreground not-data-[variant=destructive]:data-highlighted:**:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className\n )}\n {...props}\n >\n {children}\n <ComboboxPrimitive.ItemIndicator\n render={<span className=\"pointer-events-none absolute right-2 flex size-4 items-center justify-center\" />}\n >\n <IconCheck className=\"pointer-events-none\" />\n </ComboboxPrimitive.ItemIndicator>\n </ComboboxPrimitive.Item>\n )\n}\n\nfunction ComboboxGroup({ className, ...props }: ComboboxGroupProps) {\n return <ComboboxPrimitive.Group data-slot=\"combobox-group\" className={cn(className)} {...props} />\n}\n\nfunction ComboboxLabel({ className, ...props }: ComboboxLabelProps) {\n return (\n <ComboboxPrimitive.GroupLabel\n data-slot=\"combobox-label\"\n className={cn('px-2 py-1.5 text-xs text-muted-foreground', className)}\n {...props}\n />\n )\n}\n\nfunction ComboboxCollection({ ...props }: ComboboxCollectionProps) {\n return <ComboboxPrimitive.Collection data-slot=\"combobox-collection\" {...props} />\n}\n\nfunction ComboboxEmpty({ className, ...props }: ComboboxEmptyProps) {\n return (\n <ComboboxPrimitive.Empty\n data-slot=\"combobox-empty\"\n className={cn(\n 'hidden w-full justify-center py-2 text-center text-sm text-muted-foreground group-data-empty/combobox-content:flex',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction ComboboxSeparator({ className, ...props }: ComboboxSeparatorProps) {\n return (\n <ComboboxPrimitive.Separator\n data-slot=\"combobox-separator\"\n className={cn('-mx-1 my-1 h-px bg-border', className)}\n {...props}\n />\n )\n}\n\nfunction ComboboxChips({ className, ...props }: ComboboxChipsProps) {\n return (\n <ComboboxPrimitive.Chips\n data-slot=\"combobox-chips\"\n className={cn(\n 'flex min-h-8 flex-wrap items-center gap-1 rounded-lg border border-input bg-transparent bg-clip-padding px-2.5 py-1 text-sm transition-colors focus-within:border-ring focus-within:ring-3 focus-within:ring-ring/50 has-aria-invalid:border-destructive has-aria-invalid:ring-3 has-aria-invalid:ring-destructive/20 has-data-[slot=combobox-chip]:px-1 dark:bg-input/30 dark:has-aria-invalid:border-destructive/50 dark:has-aria-invalid:ring-destructive/40',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction ComboboxChip({ className, children, showRemove = true, ...props }: ComboboxChipProps) {\n return (\n <ComboboxPrimitive.Chip\n data-slot=\"combobox-chip\"\n className={cn(\n 'flex h-[calc(--spacing(5.25))] w-fit items-center justify-center gap-1 rounded-sm bg-muted px-1.5 text-xs font-medium whitespace-nowrap text-foreground has-disabled:pointer-events-none has-disabled:cursor-not-allowed has-disabled:opacity-50 has-data-[slot=combobox-chip-remove]:pr-0',\n className\n )}\n {...props}\n >\n {children}\n {showRemove && (\n <ComboboxPrimitive.ChipRemove\n render={<Button variant=\"ghost\" color=\"zinc\" size=\"icon-xs\" />}\n className=\"-ml-1 opacity-50 hover:opacity-100\"\n data-slot=\"combobox-chip-remove\"\n >\n <IconX className=\"pointer-events-none\" />\n </ComboboxPrimitive.ChipRemove>\n )}\n </ComboboxPrimitive.Chip>\n )\n}\n\nfunction ComboboxChipsInput({ className, ...props }: ComboboxChipsInputProps) {\n return (\n <ComboboxPrimitive.Input\n data-slot=\"combobox-chip-input\"\n className={cn('min-w-16 flex-1 outline-none', className)}\n {...props}\n />\n )\n}\n\nfunction useComboboxAnchor() {\n return React.useRef<HTMLDivElement | null>(null)\n}\n\nexport {\n Combobox,\n ComboboxChip,\n ComboboxChips,\n ComboboxChipsInput,\n ComboboxClear,\n ComboboxCollection,\n ComboboxContent,\n ComboboxEmpty,\n ComboboxGroup,\n ComboboxInput,\n ComboboxItem,\n ComboboxLabel,\n ComboboxList,\n ComboboxSeparator,\n ComboboxTrigger,\n ComboboxValue,\n useComboboxAnchor\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"combobox.js","names":["ComboboxPrimitive"],"sources":["../../src/components/combobox.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Combobox as ComboboxPrimitive } from '@base-ui/react'\nimport { IconCheck, IconSelector, IconX } from '@tabler/icons-react'\n\nimport { cn } from '../lib/utils'\nimport { Button } from './button'\nimport { InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput } from './input-group'\n\nexport type ComboboxProps = React.ComponentProps<typeof ComboboxPrimitive.Root>\n\nexport type ComboboxValueProps = ComboboxPrimitive.Value.Props\n\nexport type ComboboxTriggerProps = ComboboxPrimitive.Trigger.Props & {\n icon?: React.ReactNode\n}\n\nexport type ComboboxClearProps = ComboboxPrimitive.Clear.Props\n\nexport type ComboboxInputProps = ComboboxPrimitive.Input.Props & {\n icon?: React.ReactNode\n triggerIcon?: React.ReactNode\n showTrigger?: boolean\n showClear?: boolean\n}\n\nexport type ComboboxContentProps = ComboboxPrimitive.Popup.Props &\n Pick<ComboboxPrimitive.Positioner.Props, 'side' | 'align' | 'sideOffset' | 'alignOffset' | 'anchor'> & {\n container?: ComboboxPrimitive.Portal.Props['container']\n }\n\nexport type ComboboxListProps = ComboboxPrimitive.List.Props\n\nexport type ComboboxItemProps = ComboboxPrimitive.Item.Props\n\nexport type ComboboxGroupProps = ComboboxPrimitive.Group.Props\n\nexport type ComboboxLabelProps = ComboboxPrimitive.GroupLabel.Props\n\nexport type ComboboxCollectionProps = ComboboxPrimitive.Collection.Props\n\nexport type ComboboxEmptyProps = ComboboxPrimitive.Empty.Props\n\nexport type ComboboxSeparatorProps = ComboboxPrimitive.Separator.Props\n\nexport type ComboboxChipsProps = React.ComponentPropsWithRef<typeof ComboboxPrimitive.Chips> &\n ComboboxPrimitive.Chips.Props\n\nexport type ComboboxChipProps = ComboboxPrimitive.Chip.Props & {\n showRemove?: boolean\n}\n\nexport type ComboboxChipsInputProps = ComboboxPrimitive.Input.Props\n\nconst Combobox = ComboboxPrimitive.Root\n\nfunction ComboboxValue({ ...props }: ComboboxValueProps) {\n return <ComboboxPrimitive.Value data-slot=\"combobox-value\" {...props} />\n}\n\nfunction ComboboxTrigger({\n className,\n children,\n icon = <IconSelector className=\"pointer-events-none size-4 text-muted-foreground\" />,\n ...props\n}: ComboboxTriggerProps) {\n return (\n <ComboboxPrimitive.Trigger\n data-slot=\"combobox-trigger\"\n className={cn(\"[&_svg:not([class*='size-'])]:size-4\", className)}\n {...props}\n >\n {children}\n {icon}\n </ComboboxPrimitive.Trigger>\n )\n}\n\nfunction ComboboxClear({ className, ...props }: ComboboxClearProps) {\n return (\n <ComboboxPrimitive.Clear\n data-slot=\"combobox-clear\"\n render={<InputGroupButton variant=\"ghost\" size=\"icon-xs\" />}\n className={cn(className)}\n {...props}\n >\n <IconX className=\"pointer-events-none\" />\n </ComboboxPrimitive.Clear>\n )\n}\n\nfunction ComboboxInput({\n className,\n children,\n disabled = false,\n icon,\n showTrigger = true,\n showClear = false,\n triggerIcon,\n ...props\n}: ComboboxInputProps) {\n return (\n <InputGroup className={cn('w-auto', className)}>\n {icon && <InputGroupAddon align=\"inline-start\">{icon}</InputGroupAddon>}\n <ComboboxPrimitive.Input render={<InputGroupInput disabled={disabled} />} {...props} />\n <InputGroupAddon align=\"inline-end\">\n {showTrigger && (\n <InputGroupButton\n size=\"icon-xs\"\n variant=\"ghost\"\n asChild\n data-slot=\"input-group-button\"\n className=\"group-has-data-[slot=combobox-clear]/input-group:hidden data-pressed:bg-transparent\"\n disabled={disabled}\n >\n <ComboboxTrigger icon={triggerIcon} />\n </InputGroupButton>\n )}\n {showClear && <ComboboxClear disabled={disabled} />}\n </InputGroupAddon>\n {children}\n </InputGroup>\n )\n}\n\nfunction ComboboxContent({\n className,\n side = 'bottom',\n sideOffset = 6,\n align = 'start',\n alignOffset = 0,\n anchor,\n container,\n ...props\n}: ComboboxContentProps) {\n return (\n <ComboboxPrimitive.Portal container={container} className=\"absolute\">\n <ComboboxPrimitive.Positioner\n side={side}\n sideOffset={sideOffset}\n align={align}\n alignOffset={alignOffset}\n anchor={anchor}\n className=\"isolate z-50\"\n >\n <ComboboxPrimitive.Popup\n data-slot=\"combobox-content\"\n data-chips={!!anchor}\n className={cn(\n 'group/combobox-content max-h-(--available-height) w-(--anchor-width) max-w-(--available-width) min-w-[calc(var(--anchor-width)+--spacing(7))] origin-(--transform-origin) overflow-hidden rounded-lg text-popover-foreground shadow-md ring-1 ring-foreground/10 duration-100 data-[chips=true]:min-w-(--anchor-width) data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 *:data-[slot=input-group]:m-1 *:data-[slot=input-group]:mb-0 *:data-[slot=input-group]:h-8 *:data-[slot=input-group]:border-input/30 *:data-[slot=input-group]:bg-input/30 *:data-[slot=input-group]:shadow-none data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95 animate-none! relative bg-popover/70 before:pointer-events-none before:absolute before:inset-0 before:-z-1 before:rounded-[inherit] before:backdrop-blur-2xl before:backdrop-saturate-150 **:data-[slot$=-item]:focus:bg-foreground/10 **:data-[slot$=-item]:data-highlighted:bg-foreground/10 **:data-[slot$=-separator]:bg-foreground/5 **:data-[slot$=-trigger]:focus:bg-foreground/10 **:data-[slot$=-trigger]:aria-expanded:bg-foreground/10! **:data-[variant=destructive]:focus:bg-foreground/10! **:data-[variant=destructive]:text-accent-foreground! **:data-[variant=destructive]:**:text-accent-foreground!',\n className\n )}\n {...props}\n />\n </ComboboxPrimitive.Positioner>\n </ComboboxPrimitive.Portal>\n )\n}\n\nfunction ComboboxList({ className, ...props }: ComboboxListProps) {\n return (\n <ComboboxPrimitive.List\n data-slot=\"combobox-list\"\n className={cn(\n 'no-scrollbar max-h-[min(calc(--spacing(72)---spacing(9)),calc(var(--available-height)---spacing(9)))] scroll-py-1 overflow-y-auto overscroll-contain p-1 data-empty:p-0',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction ComboboxItem({ className, children, ...props }: ComboboxItemProps) {\n return (\n <ComboboxPrimitive.Item\n data-slot=\"combobox-item\"\n className={cn(\n \"relative flex w-full cursor-default items-center gap-2 rounded-md py-1 pr-8 pl-1.5 text-sm outline-hidden select-none data-highlighted:bg-accent data-highlighted:text-accent-foreground not-data-[variant=destructive]:data-highlighted:**:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className\n )}\n {...props}\n >\n {children}\n <ComboboxPrimitive.ItemIndicator\n render={<span className=\"pointer-events-none absolute right-2 flex size-4 items-center justify-center\" />}\n >\n <IconCheck className=\"pointer-events-none\" />\n </ComboboxPrimitive.ItemIndicator>\n </ComboboxPrimitive.Item>\n )\n}\n\nfunction ComboboxGroup({ className, ...props }: ComboboxGroupProps) {\n return <ComboboxPrimitive.Group data-slot=\"combobox-group\" className={cn(className)} {...props} />\n}\n\nfunction ComboboxLabel({ className, ...props }: ComboboxLabelProps) {\n return (\n <ComboboxPrimitive.GroupLabel\n data-slot=\"combobox-label\"\n className={cn('px-2 py-1.5 text-xs text-muted-foreground', className)}\n {...props}\n />\n )\n}\n\nfunction ComboboxCollection({ ...props }: ComboboxCollectionProps) {\n return <ComboboxPrimitive.Collection data-slot=\"combobox-collection\" {...props} />\n}\n\nfunction ComboboxEmpty({ className, ...props }: ComboboxEmptyProps) {\n return (\n <ComboboxPrimitive.Empty\n data-slot=\"combobox-empty\"\n className={cn(\n 'hidden w-full justify-center py-2 text-center text-sm text-muted-foreground group-data-empty/combobox-content:flex',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction ComboboxSeparator({ className, ...props }: ComboboxSeparatorProps) {\n return (\n <ComboboxPrimitive.Separator\n data-slot=\"combobox-separator\"\n className={cn('-mx-1 my-1 h-px bg-border', className)}\n {...props}\n />\n )\n}\n\nfunction ComboboxChips({ className, ...props }: ComboboxChipsProps) {\n return (\n <ComboboxPrimitive.Chips\n data-slot=\"combobox-chips\"\n className={cn(\n 'flex min-h-8 flex-wrap items-center gap-1 rounded-lg border border-input bg-transparent bg-clip-padding px-2.5 py-1 text-sm transition-colors focus-within:border-ring focus-within:ring-3 focus-within:ring-ring/50 has-aria-invalid:border-destructive has-aria-invalid:ring-3 has-aria-invalid:ring-destructive/20 has-data-[slot=combobox-chip]:px-1 dark:bg-input/30 dark:has-aria-invalid:border-destructive/50 dark:has-aria-invalid:ring-destructive/40',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction ComboboxChip({ className, children, showRemove = true, ...props }: ComboboxChipProps) {\n return (\n <ComboboxPrimitive.Chip\n data-slot=\"combobox-chip\"\n className={cn(\n 'flex h-[calc(--spacing(5.25))] w-fit items-center justify-center gap-1 rounded-sm bg-muted px-1.5 text-xs font-medium whitespace-nowrap text-foreground has-disabled:pointer-events-none has-disabled:cursor-not-allowed has-disabled:opacity-50 has-data-[slot=combobox-chip-remove]:pr-0',\n className\n )}\n {...props}\n >\n {children}\n {showRemove && (\n <ComboboxPrimitive.ChipRemove\n render={<Button variant=\"ghost\" color=\"zinc\" size=\"icon-xs\" />}\n className=\"-ml-1 opacity-50 hover:opacity-100\"\n data-slot=\"combobox-chip-remove\"\n >\n <IconX className=\"pointer-events-none\" />\n </ComboboxPrimitive.ChipRemove>\n )}\n </ComboboxPrimitive.Chip>\n )\n}\n\nfunction ComboboxChipsInput({ className, ...props }: ComboboxChipsInputProps) {\n return (\n <ComboboxPrimitive.Input\n data-slot=\"combobox-chip-input\"\n className={cn('min-w-16 flex-1 outline-none', className)}\n {...props}\n />\n )\n}\n\nfunction useComboboxAnchor() {\n return React.useRef<HTMLDivElement | null>(null)\n}\n\nexport {\n Combobox,\n ComboboxChip,\n ComboboxChips,\n ComboboxChipsInput,\n ComboboxClear,\n ComboboxCollection,\n ComboboxContent,\n ComboboxEmpty,\n ComboboxGroup,\n ComboboxInput,\n ComboboxItem,\n ComboboxLabel,\n ComboboxList,\n ComboboxSeparator,\n ComboboxTrigger,\n ComboboxValue,\n useComboboxAnchor\n}\n"],"mappings":"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"}
|
|
@@ -13,16 +13,13 @@ type DialogSize = NonNullable<VariantProps<typeof dialogContentVariants>['size']
|
|
|
13
13
|
type DialogProps = React.ComponentProps<typeof Dialog$1.Root> & {
|
|
14
14
|
size?: DialogSize;
|
|
15
15
|
};
|
|
16
|
-
type DialogTriggerProps = React.ComponentProps<typeof Dialog$1.Trigger
|
|
17
|
-
render?: React.ReactElement;
|
|
18
|
-
};
|
|
16
|
+
type DialogTriggerProps = React.ComponentProps<typeof Dialog$1.Trigger>;
|
|
19
17
|
type DialogPortalProps = React.ComponentProps<typeof Dialog$1.Portal>;
|
|
20
|
-
type DialogCloseProps = React.ComponentProps<typeof Dialog$1.Close
|
|
21
|
-
render?: React.ReactElement;
|
|
22
|
-
};
|
|
18
|
+
type DialogCloseProps = React.ComponentProps<typeof Dialog$1.Close>;
|
|
23
19
|
type DialogOverlayProps = React.ComponentProps<typeof Dialog$1.Overlay>;
|
|
24
20
|
type DialogContentProps = React.ComponentProps<typeof Dialog$1.Content> & {
|
|
25
21
|
showCloseButton?: boolean;
|
|
22
|
+
overlayRef?: React.Ref<HTMLDivElement>;
|
|
26
23
|
};
|
|
27
24
|
type DialogHeaderProps = React.ComponentProps<'div'>;
|
|
28
25
|
type DialogFooterProps = React.ComponentProps<'div'> & {
|
|
@@ -35,18 +32,14 @@ declare function Dialog({
|
|
|
35
32
|
...props
|
|
36
33
|
}: DialogProps): _$react_jsx_runtime0.JSX.Element;
|
|
37
34
|
declare function DialogTrigger({
|
|
38
|
-
render,
|
|
39
|
-
children,
|
|
40
35
|
...props
|
|
41
|
-
}:
|
|
36
|
+
}: React.ComponentProps<typeof Dialog$1.Trigger>): _$react_jsx_runtime0.JSX.Element;
|
|
42
37
|
declare function DialogPortal({
|
|
43
38
|
...props
|
|
44
39
|
}: DialogPortalProps): _$react_jsx_runtime0.JSX.Element;
|
|
45
40
|
declare function DialogClose({
|
|
46
|
-
render,
|
|
47
|
-
children,
|
|
48
41
|
...props
|
|
49
|
-
}:
|
|
42
|
+
}: React.ComponentProps<typeof Dialog$1.Close>): _$react_jsx_runtime0.JSX.Element;
|
|
50
43
|
declare function DialogOverlay({
|
|
51
44
|
className,
|
|
52
45
|
...props
|
|
@@ -55,6 +48,7 @@ declare function DialogContent({
|
|
|
55
48
|
className,
|
|
56
49
|
children,
|
|
57
50
|
showCloseButton,
|
|
51
|
+
overlayRef,
|
|
58
52
|
...props
|
|
59
53
|
}: DialogContentProps): _$react_jsx_runtime0.JSX.Element;
|
|
60
54
|
declare function DialogHeader({
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import"../chunk-CHh1Zzun.js";import{cn as e}from"../lib/utils.js";import{Button as t}from"./button.js";import{IconX as n}from"@tabler/icons-react";import{Dialog as r}from"radix-ui";import{jsx as i,jsxs as a}from"react/jsx-runtime";import{cva as o}from"class-variance-authority";import*as s from"react";const c=o(`bg-background data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 ring-foreground/10 grid max-w-[calc(100%-2rem)] gap-4 rounded-xl p-4 text-sm ring-1 duration-100 fixed top-1/2 left-1/2 z-50 w-full -translate-x-1/2 -translate-y-1/2 outline-none`,{variants:{size:{sm:`sm:max-w-sm`,md:`sm:max-w-md`,lg:`sm:max-w-lg`,xl:`sm:max-w-xl`,"2xl":`sm:max-w-2xl`}},defaultVariants:{size:`sm`}}),l=s.createContext({size:`sm`});function Dialog({size:e=`sm`,...t}){let n=s.useMemo(()=>({size:e}),[e]);return i(l.Provider,{value:n,children:i(r.Root,{"data-slot":`dialog`,...t})})}function DialogTrigger({
|
|
1
|
+
import"../chunk-CHh1Zzun.js";import{cn as e}from"../lib/utils.js";import{Button as t}from"./button.js";import{IconX as n}from"@tabler/icons-react";import{Dialog as r}from"radix-ui";import{jsx as i,jsxs as a}from"react/jsx-runtime";import{cva as o}from"class-variance-authority";import*as s from"react";const c=o(`bg-background data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 ring-foreground/10 grid max-w-[calc(100%-2rem)] gap-4 rounded-xl p-4 text-sm ring-1 duration-100 fixed top-1/2 left-1/2 z-50 w-full -translate-x-1/2 -translate-y-1/2 outline-none`,{variants:{size:{sm:`sm:max-w-sm`,md:`sm:max-w-md`,lg:`sm:max-w-lg`,xl:`sm:max-w-xl`,"2xl":`sm:max-w-2xl`}},defaultVariants:{size:`sm`}}),l=s.createContext({size:`sm`});function Dialog({size:e=`sm`,...t}){let n=s.useMemo(()=>({size:e}),[e]);return i(l.Provider,{value:n,children:i(r.Root,{"data-slot":`dialog`,...t})})}function DialogTrigger({...e}){return i(r.Trigger,{"data-slot":`dialog-trigger`,...e})}function DialogPortal({...e}){return i(r.Portal,{"data-slot":`dialog-portal`,...e})}function DialogClose({...e}){return i(r.Close,{"data-slot":`dialog-close`,...e})}function DialogOverlay({className:t,...n}){return i(r.Overlay,{"data-slot":`dialog-overlay`,className:e(`bg-black/10 fixed inset-0 isolate z-50`,`data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0`,`duration-100 supports-backdrop-filter:backdrop-blur-xs`,t),...n})}function DialogContent({className:o,children:u,showCloseButton:d=!0,overlayRef:f,...p}){let{size:m}=s.useContext(l);return a(DialogPortal,{children:[i(DialogOverlay,{ref:f}),a(r.Content,{"data-slot":`dialog-content`,className:e(c({size:m}),o),...p,children:[u,d&&i(r.Close,{"data-slot":`dialog-close`,asChild:!0,children:a(t,{variant:`ghost`,className:`absolute top-2 right-2`,size:`icon-sm`,children:[i(n,{}),i(`span`,{className:`sr-only`,children:`Close`})]})})]})]})}function DialogHeader({className:t,...n}){return i(`div`,{"data-slot":`dialog-header`,className:e(`gap-2 flex flex-col`,t),...n})}function DialogFooter({className:n,showCloseButton:o=!1,children:s,...c}){return a(`div`,{"data-slot":`dialog-footer`,className:e(`bg-muted/50 -mx-4 -mb-4 rounded-b-xl border-t p-4`,`flex flex-col-reverse gap-2 sm:flex-row sm:justify-end`,n),...c,children:[s,o&&i(r.Close,{asChild:!0,children:i(t,{variant:`outline`,children:`Close`})})]})}function DialogTitle({className:t,...n}){return i(r.Title,{"data-slot":`dialog-title`,className:e(`text-base leading-none font-medium`,t),...n})}function DialogDescription({className:t,...n}){return i(r.Description,{"data-slot":`dialog-description`,className:e(`text-muted-foreground text-sm`,`*:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-foreground`,t),...n})}export{Dialog,DialogClose,DialogContent,DialogDescription,DialogFooter,DialogHeader,DialogOverlay,DialogPortal,DialogTitle,DialogTrigger};
|
|
2
2
|
//# sourceMappingURL=dialog.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dialog.js","names":["DialogPrimitive"],"sources":["../../src/components/dialog.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { IconX } from '@tabler/icons-react'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { Dialog as DialogPrimitive } from 'radix-ui'\n\nimport { cn } from '../lib/utils'\nimport { Button } from './button'\n\nconst dialogContentVariants = cva(\n 'bg-background data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 ring-foreground/10 grid max-w-[calc(100%-2rem)] gap-4 rounded-xl p-4 text-sm ring-1 duration-100 fixed top-1/2 left-1/2 z-50 w-full -translate-x-1/2 -translate-y-1/2 outline-none',\n {\n variants: {\n size: {\n sm: 'sm:max-w-sm',\n md: 'sm:max-w-md',\n lg: 'sm:max-w-lg',\n xl: 'sm:max-w-xl',\n '2xl': 'sm:max-w-2xl'\n }\n },\n defaultVariants: {\n size: 'sm'\n }\n }\n)\n\ntype DialogSize = NonNullable<VariantProps<typeof dialogContentVariants>['size']>\ntype DialogSizeContextValue = { size: DialogSize }\nconst DialogSizeContext = React.createContext<DialogSizeContextValue>({ size: 'sm' })\n\nexport type DialogProps = React.ComponentProps<typeof DialogPrimitive.Root> & { size?: DialogSize }\nexport type DialogTriggerProps = React.ComponentProps<typeof DialogPrimitive.Trigger
|
|
1
|
+
{"version":3,"file":"dialog.js","names":["DialogPrimitive"],"sources":["../../src/components/dialog.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { IconX } from '@tabler/icons-react'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { Dialog as DialogPrimitive } from 'radix-ui'\n\nimport { cn } from '../lib/utils'\nimport { Button } from './button'\n\nconst dialogContentVariants = cva(\n 'bg-background data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 ring-foreground/10 grid max-w-[calc(100%-2rem)] gap-4 rounded-xl p-4 text-sm ring-1 duration-100 fixed top-1/2 left-1/2 z-50 w-full -translate-x-1/2 -translate-y-1/2 outline-none',\n {\n variants: {\n size: {\n sm: 'sm:max-w-sm',\n md: 'sm:max-w-md',\n lg: 'sm:max-w-lg',\n xl: 'sm:max-w-xl',\n '2xl': 'sm:max-w-2xl'\n }\n },\n defaultVariants: {\n size: 'sm'\n }\n }\n)\n\ntype DialogSize = NonNullable<VariantProps<typeof dialogContentVariants>['size']>\ntype DialogSizeContextValue = { size: DialogSize }\nconst DialogSizeContext = React.createContext<DialogSizeContextValue>({ size: 'sm' })\n\nexport type DialogProps = React.ComponentProps<typeof DialogPrimitive.Root> & { size?: DialogSize }\nexport type DialogTriggerProps = React.ComponentProps<typeof DialogPrimitive.Trigger>\nexport type DialogPortalProps = React.ComponentProps<typeof DialogPrimitive.Portal>\nexport type DialogCloseProps = React.ComponentProps<typeof DialogPrimitive.Close>\nexport type DialogOverlayProps = React.ComponentProps<typeof DialogPrimitive.Overlay>\nexport type DialogContentProps = React.ComponentProps<typeof DialogPrimitive.Content> & {\n showCloseButton?: boolean\n overlayRef?: React.Ref<HTMLDivElement>\n}\nexport type DialogHeaderProps = React.ComponentProps<'div'>\nexport type DialogFooterProps = React.ComponentProps<'div'> & { showCloseButton?: boolean }\nexport type DialogTitleProps = React.ComponentProps<typeof DialogPrimitive.Title>\nexport type DialogDescriptionProps = React.ComponentProps<typeof DialogPrimitive.Description>\n\nfunction Dialog({ size = 'sm', ...props }: DialogProps) {\n const contextValue = React.useMemo<DialogSizeContextValue>(() => ({ size }), [size])\n\n return (\n <DialogSizeContext.Provider value={contextValue}>\n <DialogPrimitive.Root data-slot=\"dialog\" {...props} />\n </DialogSizeContext.Provider>\n )\n}\n\nfunction DialogTrigger({ ...props }: React.ComponentProps<typeof DialogPrimitive.Trigger>) {\n return <DialogPrimitive.Trigger data-slot=\"dialog-trigger\" {...props} />\n}\n\nfunction DialogPortal({ ...props }: DialogPortalProps) {\n return <DialogPrimitive.Portal data-slot=\"dialog-portal\" {...props} />\n}\n\nfunction DialogClose({ ...props }: React.ComponentProps<typeof DialogPrimitive.Close>) {\n return <DialogPrimitive.Close data-slot=\"dialog-close\" {...props} />\n}\n\nfunction DialogOverlay({ className, ...props }: DialogOverlayProps) {\n return (\n <DialogPrimitive.Overlay\n data-slot=\"dialog-overlay\"\n className={cn(\n 'bg-black/10 fixed inset-0 isolate z-50',\n 'data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0',\n 'duration-100 supports-backdrop-filter:backdrop-blur-xs',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction DialogContent({ className, children, showCloseButton = true, overlayRef, ...props }: DialogContentProps) {\n const { size } = React.useContext(DialogSizeContext)\n\n return (\n <DialogPortal>\n <DialogOverlay ref={overlayRef} />\n <DialogPrimitive.Content\n data-slot=\"dialog-content\"\n className={cn(dialogContentVariants({ size }), className)}\n {...props}\n >\n {children}\n {showCloseButton && (\n <DialogPrimitive.Close data-slot=\"dialog-close\" asChild>\n <Button variant=\"ghost\" className=\"absolute top-2 right-2\" size=\"icon-sm\">\n <IconX />\n <span className=\"sr-only\">Close</span>\n </Button>\n </DialogPrimitive.Close>\n )}\n </DialogPrimitive.Content>\n </DialogPortal>\n )\n}\n\nfunction DialogHeader({ className, ...props }: DialogHeaderProps) {\n return <div data-slot=\"dialog-header\" className={cn('gap-2 flex flex-col', className)} {...props} />\n}\n\nfunction DialogFooter({ className, showCloseButton = false, children, ...props }: DialogFooterProps) {\n return (\n <div\n data-slot=\"dialog-footer\"\n className={cn(\n 'bg-muted/50 -mx-4 -mb-4 rounded-b-xl border-t p-4',\n 'flex flex-col-reverse gap-2 sm:flex-row sm:justify-end',\n className\n )}\n {...props}\n >\n {children}\n {showCloseButton && (\n <DialogPrimitive.Close asChild>\n <Button variant=\"outline\">Close</Button>\n </DialogPrimitive.Close>\n )}\n </div>\n )\n}\n\nfunction DialogTitle({ className, ...props }: DialogTitleProps) {\n return (\n <DialogPrimitive.Title\n data-slot=\"dialog-title\"\n className={cn('text-base leading-none font-medium', className)}\n {...props}\n />\n )\n}\n\nfunction DialogDescription({ className, ...props }: DialogDescriptionProps) {\n return (\n <DialogPrimitive.Description\n data-slot=\"dialog-description\"\n className={cn(\n 'text-muted-foreground text-sm',\n '*:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-foreground',\n className\n )}\n {...props}\n />\n )\n}\n\nexport {\n Dialog,\n DialogClose,\n DialogContent,\n DialogDescription,\n DialogFooter,\n DialogHeader,\n DialogOverlay,\n DialogPortal,\n DialogTitle,\n DialogTrigger\n}\n"],"mappings":"8SASA,MAAM,EAAwB,EAC5B,wUACA,CACE,SAAU,CACR,KAAM,CACJ,GAAI,cACJ,GAAI,cACJ,GAAI,cACJ,GAAI,cACJ,MAAO,eACR,CACF,CACD,gBAAiB,CACf,KAAM,KACP,CACF,CACF,CAIK,EAAoB,EAAM,cAAsC,CAAE,KAAM,KAAM,CAAC,CAgBrF,SAAS,OAAO,CAAE,OAAO,KAAM,GAAG,GAAsB,CACtD,IAAM,EAAe,EAAM,aAAuC,CAAE,OAAM,EAAG,CAAC,EAAK,CAAC,CAEpF,OACE,EAAC,EAAkB,SAAnB,CAA4B,MAAO,WACjC,EAACA,EAAgB,KAAjB,CAAsB,YAAU,SAAS,GAAI,EAAS,CAAA,CAC3B,CAAA,CAIjC,SAAS,cAAc,CAAE,GAAG,GAA+D,CACzF,OAAO,EAACA,EAAgB,QAAjB,CAAyB,YAAU,iBAAiB,GAAI,EAAS,CAAA,CAG1E,SAAS,aAAa,CAAE,GAAG,GAA4B,CACrD,OAAO,EAACA,EAAgB,OAAjB,CAAwB,YAAU,gBAAgB,GAAI,EAAS,CAAA,CAGxE,SAAS,YAAY,CAAE,GAAG,GAA6D,CACrF,OAAO,EAACA,EAAgB,MAAjB,CAAuB,YAAU,eAAe,GAAI,EAAS,CAAA,CAGtE,SAAS,cAAc,CAAE,YAAW,GAAG,GAA6B,CAClE,OACE,EAACA,EAAgB,QAAjB,CACE,YAAU,iBACV,UAAW,EACT,yCACA,0FACA,yDACA,EACD,CACD,GAAI,EACJ,CAAA,CAIN,SAAS,cAAc,CAAE,YAAW,WAAU,kBAAkB,GAAM,aAAY,GAAG,GAA6B,CAChH,GAAM,CAAE,QAAS,EAAM,WAAW,EAAkB,CAEpD,OACE,EAAC,aAAD,CAAA,SAAA,CACE,EAAC,cAAD,CAAe,IAAK,EAAc,CAAA,CAClC,EAACA,EAAgB,QAAjB,CACE,YAAU,iBACV,UAAW,EAAG,EAAsB,CAAE,OAAM,CAAC,CAAE,EAAU,CACzD,GAAI,WAHN,CAKG,EACA,GACC,EAACA,EAAgB,MAAjB,CAAuB,YAAU,eAAe,QAAA,YAC9C,EAAC,EAAD,CAAQ,QAAQ,QAAQ,UAAU,yBAAyB,KAAK,mBAAhE,CACE,EAAC,EAAD,EAAS,CAAA,CACT,EAAC,OAAD,CAAM,UAAU,mBAAU,QAAY,CAAA,CAC/B,GACa,CAAA,CAEF,GACb,CAAA,CAAA,CAInB,SAAS,aAAa,CAAE,YAAW,GAAG,GAA4B,CAChE,OAAO,EAAC,MAAD,CAAK,YAAU,gBAAgB,UAAW,EAAG,sBAAuB,EAAU,CAAE,GAAI,EAAS,CAAA,CAGtG,SAAS,aAAa,CAAE,YAAW,kBAAkB,GAAO,WAAU,GAAG,GAA4B,CACnG,OACE,EAAC,MAAD,CACE,YAAU,gBACV,UAAW,EACT,oDACA,yDACA,EACD,CACD,GAAI,WAPN,CASG,EACA,GACC,EAACA,EAAgB,MAAjB,CAAuB,QAAA,YACrB,EAAC,EAAD,CAAQ,QAAQ,mBAAU,QAAc,CAAA,CAClB,CAAA,CAEtB,GAIV,SAAS,YAAY,CAAE,YAAW,GAAG,GAA2B,CAC9D,OACE,EAACA,EAAgB,MAAjB,CACE,YAAU,eACV,UAAW,EAAG,qCAAsC,EAAU,CAC9D,GAAI,EACJ,CAAA,CAIN,SAAS,kBAAkB,CAAE,YAAW,GAAG,GAAiC,CAC1E,OACE,EAACA,EAAgB,YAAjB,CACE,YAAU,qBACV,UAAW,EACT,gCACA,uEACA,EACD,CACD,GAAI,EACJ,CAAA"}
|
package/dist/components/field.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import"../chunk-CHh1Zzun.js";import{cn as e}from"../lib/utils.js";import{Separator as t}from"./separator.js";import{Label as n}from"./label.js";import{jsx as r,jsxs as i}from"react/jsx-runtime";import{cva as a}from"class-variance-authority";import{useMemo as o}from"react";function FieldSet({className:t,...n}){return r(`fieldset`,{"data-slot":`field-set`,className:e(`flex flex-col gap-4`,`has-[>[data-slot=checkbox-group]]:gap-3 has-[>[data-slot=radio-group]]:gap-3`,t),...n})}function FieldLegend({className:t,variant:n=`legend`,...i}){return r(`legend`,{"data-slot":`field-legend`,"data-variant":n,className:e(`mb-1.5 font-medium data-[variant=label]:text-sm data-[variant=legend]:text-base`,t),...i})}function FieldGroup({className:t,...n}){return r(`div`,{"data-slot":`field-group`,className:e(`group/field-group @container/field-group flex w-full flex-col gap-5`,`data-[slot=checkbox-group]:gap-3 *:data-[slot=field-group]:gap-4`,t),...n})}const s=a(`data-[invalid=true]:text-destructive gap-
|
|
1
|
+
import"../chunk-CHh1Zzun.js";import{cn as e}from"../lib/utils.js";import{Separator as t}from"./separator.js";import{Label as n}from"./label.js";import{jsx as r,jsxs as i}from"react/jsx-runtime";import{cva as a}from"class-variance-authority";import{useMemo as o}from"react";function FieldSet({className:t,...n}){return r(`fieldset`,{"data-slot":`field-set`,className:e(`flex flex-col gap-4`,`has-[>[data-slot=checkbox-group]]:gap-3 has-[>[data-slot=radio-group]]:gap-3`,t),...n})}function FieldLegend({className:t,variant:n=`legend`,...i}){return r(`legend`,{"data-slot":`field-legend`,"data-variant":n,className:e(`mb-1.5 font-medium data-[variant=label]:text-sm data-[variant=legend]:text-base`,t),...i})}function FieldGroup({className:t,...n}){return r(`div`,{"data-slot":`field-group`,className:e(`group/field-group @container/field-group flex w-full flex-col gap-5`,`data-[slot=checkbox-group]:gap-3 *:data-[slot=field-group]:gap-4`,t),...n})}const s=a(`data-[invalid=true]:text-destructive gap-1 group/field flex w-full`,{variants:{orientation:{vertical:`flex-col *:w-full [&>.sr-only]:w-auto`,horizontal:`flex-row items-center *:data-[slot=field-label]:flex-auto has-[>[data-slot=field-content]]:items-start has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px`,responsive:`flex-col *:w-full [&>.sr-only]:w-auto @md/field-group:flex-row @md/field-group:items-center @md/field-group:*:w-auto @md/field-group:*:data-[slot=field-label]:flex-auto @md/field-group:has-[>[data-slot=field-content]]:items-start @md/field-group:has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px`}},defaultVariants:{orientation:`vertical`}});function Field({className:t,orientation:n=`vertical`,...i}){return r(`div`,{"data-slot":`field`,"data-orientation":n,className:e(s({orientation:n}),t),...i})}function FieldContent({className:t,...n}){return r(`div`,{"data-slot":`field-content`,className:e(`gap-0.5 group/field-content flex flex-1 flex-col leading-snug`,t),...n})}function FieldLabel({className:t,...i}){return r(n,{"data-slot":`field-label`,className:e(`group/field-label peer/field-label flex w-fit gap-2 leading-snug`,`has-data-checked:bg-primary/5 has-data-checked:border-primary/30 dark:has-data-checked:border-primary/20 dark:has-data-checked:bg-primary/10`,`has-[>[data-slot=field]]:w-full has-[>[data-slot=field]]:flex-col has-[>[data-slot=field]]:rounded-lg has-[>[data-slot=field]]:border *:data-[slot=field]:p-2.5`,`group-data-[disabled=true]/field:opacity-50`,t),...i})}function FieldTitle({className:t,...n}){return r(`div`,{"data-slot":`field-label`,className:e(`gap-2 text-sm font-medium group-data-[disabled=true]/field:opacity-50 flex w-fit items-center leading-snug`,t),...n})}function FieldDescription({className:t,...n}){return r(`p`,{"data-slot":`field-description`,className:e(`text-muted-foreground text-left text-sm leading-normal font-normal`,`[[data-variant=legend]+&]:-mt-1.5 group-has-data-horizontal/field:text-balance last:mt-0 nth-last-2:-mt-1`,`[&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary`,t),...n})}function FieldSeparator({children:n,className:a,...o}){return i(`div`,{"data-slot":`field-separator`,"data-content":!!n,className:e(`-my-2 h-5 text-sm group-data-[variant=outline]/field-group:-mb-2 relative`,a),...o,children:[r(t,{className:`absolute inset-0 top-1/2`}),n&&r(`span`,{className:`text-muted-foreground px-2 bg-background relative mx-auto block w-fit`,"data-slot":`field-separator-content`,children:n})]})}function FieldError({className:t,children:n,errors:i,...a}){let s=o(()=>{if(n)return n;if(!i?.length)return null;let e=[...new Map(i.map(e=>[e?.message,e])).values()];return e?.length===1?e[0]?.message:r(`ul`,{className:`ml-4 flex list-disc flex-col gap-1`,children:e.map(e=>e?.message&&r(`li`,{children:e.message},e.message))})},[n,i]);return s?r(`div`,{role:`alert`,"data-slot":`field-error`,className:e(`text-destructive text-sm font-normal`,t),...a,children:s}):null}export{Field,FieldContent,FieldDescription,FieldError,FieldGroup,FieldLabel,FieldLegend,FieldSeparator,FieldSet,FieldTitle};
|
|
2
2
|
//# sourceMappingURL=field.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"field.js","names":[],"sources":["../../src/components/field.tsx"],"sourcesContent":["import { useMemo } from 'react'\n\nimport { cva, type VariantProps } from 'class-variance-authority'\n\nimport { cn } from '../lib/utils'\nimport { Label } from './label'\nimport { Separator } from './separator'\n\nexport type FieldSetProps = React.ComponentProps<'fieldset'>\n\nexport type FieldLegendProps = React.ComponentProps<'legend'> & { variant?: 'legend' | 'label' }\n\nexport type FieldGroupProps = React.ComponentProps<'div'>\n\nexport type FieldContentProps = React.ComponentProps<'div'>\n\nexport type FieldLabelProps = React.ComponentProps<typeof Label>\n\nexport type FieldTitleProps = React.ComponentProps<'div'>\n\nexport type FieldDescriptionProps = React.ComponentProps<'p'>\n\nexport type FieldSeparatorProps = React.ComponentProps<'div'> & {\n children?: React.ReactNode\n}\n\nexport type FieldErrorProps = React.ComponentProps<'div'> & {\n errors?: Array<{ message?: string } | undefined>\n}\n\nfunction FieldSet({ className, ...props }: FieldSetProps) {\n return (\n <fieldset\n data-slot=\"field-set\"\n className={cn(\n 'flex flex-col gap-4',\n 'has-[>[data-slot=checkbox-group]]:gap-3 has-[>[data-slot=radio-group]]:gap-3',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction FieldLegend({ className, variant = 'legend', ...props }: FieldLegendProps) {\n return (\n <legend\n data-slot=\"field-legend\"\n data-variant={variant}\n className={cn('mb-1.5 font-medium data-[variant=label]:text-sm data-[variant=legend]:text-base', className)}\n {...props}\n />\n )\n}\n\nfunction FieldGroup({ className, ...props }: FieldGroupProps) {\n return (\n <div\n data-slot=\"field-group\"\n className={cn(\n 'group/field-group @container/field-group flex w-full flex-col gap-5',\n 'data-[slot=checkbox-group]:gap-3 *:data-[slot=field-group]:gap-4',\n className\n )}\n {...props}\n />\n )\n}\n\nconst fieldVariants = cva('data-[invalid=true]:text-destructive gap-
|
|
1
|
+
{"version":3,"file":"field.js","names":[],"sources":["../../src/components/field.tsx"],"sourcesContent":["import { useMemo } from 'react'\n\nimport { cva, type VariantProps } from 'class-variance-authority'\n\nimport { cn } from '../lib/utils'\nimport { Label } from './label'\nimport { Separator } from './separator'\n\nexport type FieldSetProps = React.ComponentProps<'fieldset'>\n\nexport type FieldLegendProps = React.ComponentProps<'legend'> & { variant?: 'legend' | 'label' }\n\nexport type FieldGroupProps = React.ComponentProps<'div'>\n\nexport type FieldContentProps = React.ComponentProps<'div'>\n\nexport type FieldLabelProps = React.ComponentProps<typeof Label>\n\nexport type FieldTitleProps = React.ComponentProps<'div'>\n\nexport type FieldDescriptionProps = React.ComponentProps<'p'>\n\nexport type FieldSeparatorProps = React.ComponentProps<'div'> & {\n children?: React.ReactNode\n}\n\nexport type FieldErrorProps = React.ComponentProps<'div'> & {\n errors?: Array<{ message?: string } | undefined>\n}\n\nfunction FieldSet({ className, ...props }: FieldSetProps) {\n return (\n <fieldset\n data-slot=\"field-set\"\n className={cn(\n 'flex flex-col gap-4',\n 'has-[>[data-slot=checkbox-group]]:gap-3 has-[>[data-slot=radio-group]]:gap-3',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction FieldLegend({ className, variant = 'legend', ...props }: FieldLegendProps) {\n return (\n <legend\n data-slot=\"field-legend\"\n data-variant={variant}\n className={cn('mb-1.5 font-medium data-[variant=label]:text-sm data-[variant=legend]:text-base', className)}\n {...props}\n />\n )\n}\n\nfunction FieldGroup({ className, ...props }: FieldGroupProps) {\n return (\n <div\n data-slot=\"field-group\"\n className={cn(\n 'group/field-group @container/field-group flex w-full flex-col gap-5',\n 'data-[slot=checkbox-group]:gap-3 *:data-[slot=field-group]:gap-4',\n className\n )}\n {...props}\n />\n )\n}\n\nconst fieldVariants = cva('data-[invalid=true]:text-destructive gap-1 group/field flex w-full', {\n variants: {\n orientation: {\n vertical: 'flex-col *:w-full [&>.sr-only]:w-auto',\n horizontal:\n 'flex-row items-center *:data-[slot=field-label]:flex-auto has-[>[data-slot=field-content]]:items-start has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px',\n responsive:\n 'flex-col *:w-full [&>.sr-only]:w-auto @md/field-group:flex-row @md/field-group:items-center @md/field-group:*:w-auto @md/field-group:*:data-[slot=field-label]:flex-auto @md/field-group:has-[>[data-slot=field-content]]:items-start @md/field-group:has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px'\n }\n },\n defaultVariants: {\n orientation: 'vertical'\n }\n})\n\nexport type FieldProps = React.ComponentProps<'div'> & VariantProps<typeof fieldVariants>\n\nfunction Field({ className, orientation = 'vertical', ...props }: FieldProps) {\n return (\n <div\n data-slot=\"field\"\n data-orientation={orientation}\n className={cn(fieldVariants({ orientation }), className)}\n {...props}\n />\n )\n}\n\nfunction FieldContent({ className, ...props }: FieldContentProps) {\n return (\n <div\n data-slot=\"field-content\"\n className={cn('gap-0.5 group/field-content flex flex-1 flex-col leading-snug', className)}\n {...props}\n />\n )\n}\n\nfunction FieldLabel({ className, ...props }: FieldLabelProps) {\n return (\n <Label\n data-slot=\"field-label\"\n className={cn(\n 'group/field-label peer/field-label flex w-fit gap-2 leading-snug',\n 'has-data-checked:bg-primary/5 has-data-checked:border-primary/30 dark:has-data-checked:border-primary/20 dark:has-data-checked:bg-primary/10',\n 'has-[>[data-slot=field]]:w-full has-[>[data-slot=field]]:flex-col has-[>[data-slot=field]]:rounded-lg has-[>[data-slot=field]]:border *:data-[slot=field]:p-2.5',\n 'group-data-[disabled=true]/field:opacity-50',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction FieldTitle({ className, ...props }: FieldTitleProps) {\n return (\n <div\n data-slot=\"field-label\"\n className={cn(\n 'gap-2 text-sm font-medium group-data-[disabled=true]/field:opacity-50 flex w-fit items-center leading-snug',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction FieldDescription({ className, ...props }: FieldDescriptionProps) {\n return (\n <p\n data-slot=\"field-description\"\n className={cn(\n 'text-muted-foreground text-left text-sm leading-normal font-normal',\n '[[data-variant=legend]+&]:-mt-1.5 group-has-data-horizontal/field:text-balance last:mt-0 nth-last-2:-mt-1',\n '[&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary',\n className\n )}\n {...props}\n />\n )\n}\n\nfunction FieldSeparator({ children, className, ...props }: FieldSeparatorProps) {\n return (\n <div\n data-slot=\"field-separator\"\n data-content={!!children}\n className={cn('-my-2 h-5 text-sm group-data-[variant=outline]/field-group:-mb-2 relative', className)}\n {...props}\n >\n <Separator className=\"absolute inset-0 top-1/2\" />\n {children && (\n <span\n className=\"text-muted-foreground px-2 bg-background relative mx-auto block w-fit\"\n data-slot=\"field-separator-content\"\n >\n {children}\n </span>\n )}\n </div>\n )\n}\n\nfunction FieldError({ className, children, errors, ...props }: FieldErrorProps) {\n const content = useMemo(() => {\n if (children) {\n return children\n }\n\n if (!errors?.length) {\n return null\n }\n\n const uniqueErrors = [...new Map(errors.map((error) => [error?.message, error])).values()]\n\n if (uniqueErrors?.length === 1) {\n return uniqueErrors[0]?.message\n }\n\n return (\n <ul className=\"ml-4 flex list-disc flex-col gap-1\">\n {uniqueErrors.map((error) => error?.message && <li key={error.message}>{error.message}</li>)}\n </ul>\n )\n }, [children, errors])\n\n if (!content) {\n return null\n }\n\n return (\n <div\n role=\"alert\"\n data-slot=\"field-error\"\n className={cn('text-destructive text-sm font-normal', className)}\n {...props}\n >\n {content}\n </div>\n )\n}\n\nexport {\n Field,\n FieldContent,\n FieldDescription,\n FieldError,\n FieldGroup,\n FieldLabel,\n FieldLegend,\n FieldSeparator,\n FieldSet,\n FieldTitle\n}\n"],"mappings":"iRA8BA,SAAS,SAAS,CAAE,YAAW,GAAG,GAAwB,CACxD,OACE,EAAC,WAAD,CACE,YAAU,YACV,UAAW,EACT,sBACA,+EACA,EACD,CACD,GAAI,EACJ,CAAA,CAIN,SAAS,YAAY,CAAE,YAAW,UAAU,SAAU,GAAG,GAA2B,CAClF,OACE,EAAC,SAAD,CACE,YAAU,eACV,eAAc,EACd,UAAW,EAAG,kFAAmF,EAAU,CAC3G,GAAI,EACJ,CAAA,CAIN,SAAS,WAAW,CAAE,YAAW,GAAG,GAA0B,CAC5D,OACE,EAAC,MAAD,CACE,YAAU,cACV,UAAW,EACT,sEACA,mEACA,EACD,CACD,GAAI,EACJ,CAAA,CAIN,MAAM,EAAgB,EAAI,qEAAsE,CAC9F,SAAU,CACR,YAAa,CACX,SAAU,wCACV,WACE,iLACF,WACE,gUACH,CACF,CACD,gBAAiB,CACf,YAAa,WACd,CACF,CAAC,CAIF,SAAS,MAAM,CAAE,YAAW,cAAc,WAAY,GAAG,GAAqB,CAC5E,OACE,EAAC,MAAD,CACE,YAAU,QACV,mBAAkB,EAClB,UAAW,EAAG,EAAc,CAAE,cAAa,CAAC,CAAE,EAAU,CACxD,GAAI,EACJ,CAAA,CAIN,SAAS,aAAa,CAAE,YAAW,GAAG,GAA4B,CAChE,OACE,EAAC,MAAD,CACE,YAAU,gBACV,UAAW,EAAG,gEAAiE,EAAU,CACzF,GAAI,EACJ,CAAA,CAIN,SAAS,WAAW,CAAE,YAAW,GAAG,GAA0B,CAC5D,OACE,EAAC,EAAD,CACE,YAAU,cACV,UAAW,EACT,mEACA,+IACA,kKACA,8CACA,EACD,CACD,GAAI,EACJ,CAAA,CAIN,SAAS,WAAW,CAAE,YAAW,GAAG,GAA0B,CAC5D,OACE,EAAC,MAAD,CACE,YAAU,cACV,UAAW,EACT,6GACA,EACD,CACD,GAAI,EACJ,CAAA,CAIN,SAAS,iBAAiB,CAAE,YAAW,GAAG,GAAgC,CACxE,OACE,EAAC,IAAD,CACE,YAAU,oBACV,UAAW,EACT,qEACA,4GACA,oEACA,EACD,CACD,GAAI,EACJ,CAAA,CAIN,SAAS,eAAe,CAAE,WAAU,YAAW,GAAG,GAA8B,CAC9E,OACE,EAAC,MAAD,CACE,YAAU,kBACV,eAAc,CAAC,CAAC,EAChB,UAAW,EAAG,4EAA6E,EAAU,CACrG,GAAI,WAJN,CAME,EAAC,EAAD,CAAW,UAAU,2BAA6B,CAAA,CACjD,GACC,EAAC,OAAD,CACE,UAAU,wEACV,YAAU,0BAET,WACI,CAAA,CAEL,GAIV,SAAS,WAAW,CAAE,YAAW,WAAU,SAAQ,GAAG,GAA0B,CAC9E,IAAM,EAAU,MAAc,CAC5B,GAAI,EACF,OAAO,EAGT,GAAI,CAAC,GAAQ,OACX,OAAO,KAGT,IAAM,EAAe,CAAC,GAAG,IAAI,IAAI,EAAO,IAAK,GAAU,CAAC,GAAO,QAAS,EAAM,CAAC,CAAC,CAAC,QAAQ,CAAC,CAM1F,OAJI,GAAc,SAAW,EACpB,EAAa,IAAI,QAIxB,EAAC,KAAD,CAAI,UAAU,8CACX,EAAa,IAAK,GAAU,GAAO,SAAW,EAAC,KAAD,CAAA,SAAyB,EAAM,QAAa,CAAnC,EAAM,QAA6B,CAAC,CACzF,CAAA,EAEN,CAAC,EAAU,EAAO,CAAC,CAMtB,OAJK,EAKH,EAAC,MAAD,CACE,KAAK,QACL,YAAU,cACV,UAAW,EAAG,uCAAwC,EAAU,CAChE,GAAI,WAEH,EACG,CAAA,CAXC"}
|