@waveso/ui 0.7.0 → 0.7.2
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 +1 -1
- package/dist/badge.d.ts +1 -1
- package/dist/badge.js +3 -3
- package/dist/badge.js.map +1 -1
- package/dist/button.d.ts +2 -2
- package/dist/combobox.d.ts.map +1 -1
- package/dist/combobox.js +3 -1
- package/dist/combobox.js.map +1 -1
- package/dist/context-menu.js +3 -3
- package/dist/context-menu.js.map +1 -1
- package/dist/count.d.ts.map +1 -1
- package/dist/count.js +10 -9
- package/dist/count.js.map +1 -1
- package/dist/encrypted-text.js +8 -5
- package/dist/encrypted-text.js.map +1 -1
- package/dist/form.d.ts.map +1 -1
- package/dist/form.js +1 -0
- package/dist/form.js.map +1 -1
- package/dist/gradient-reveal-text.js +2 -1
- package/dist/gradient-reveal-text.js.map +1 -1
- package/dist/infinite-scroll.js +3 -9
- package/dist/infinite-scroll.js.map +1 -1
- package/dist/label.js +1 -1
- package/dist/label.js.map +1 -1
- package/dist/lib/internal-icons.d.ts +1 -1
- package/dist/lib/internal-icons.d.ts.map +1 -1
- package/dist/lib/internal-icons.js +4 -2
- package/dist/lib/internal-icons.js.map +1 -1
- package/dist/masonry.d.ts.map +1 -1
- package/dist/masonry.js +1 -0
- package/dist/masonry.js.map +1 -1
- package/dist/sidebar.d.ts.map +1 -1
- package/dist/sidebar.js +2 -1
- package/dist/sidebar.js.map +1 -1
- package/dist/slider.d.ts +9 -0
- package/dist/slider.d.ts.map +1 -1
- package/dist/slider.js +4 -3
- package/dist/slider.js.map +1 -1
- package/dist/spinner.js +2 -0
- package/dist/spinner.js.map +1 -1
- package/dist/styles.css +66 -66
- package/dist/textarea.d.ts.map +1 -1
- package/dist/textarea.js +1 -0
- package/dist/textarea.js.map +1 -1
- package/dist/toast.d.ts +1 -1
- package/dist/toggle-group.d.ts +0 -1
- package/dist/toggle-group.d.ts.map +1 -1
- package/dist/toggle-group.js +1 -1
- package/dist/toggle-group.js.map +1 -1
- package/package.json +1 -1
package/dist/spinner.js
CHANGED
|
@@ -4,8 +4,10 @@ import { jsx } from "react/jsx-runtime";
|
|
|
4
4
|
//#region src/spinner.tsx
|
|
5
5
|
function Spinner({ className, ...props }) {
|
|
6
6
|
return /* @__PURE__ */ jsx(LoaderIcon, {
|
|
7
|
+
"data-slot": "spinner",
|
|
7
8
|
role: "status",
|
|
8
9
|
"aria-label": "Loading",
|
|
10
|
+
"aria-hidden": false,
|
|
9
11
|
className: cn("size-4 animate-spin", className),
|
|
10
12
|
...props
|
|
11
13
|
});
|
package/dist/spinner.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"spinner.js","names":[],"sources":["../src/spinner.tsx"],"sourcesContent":["import { cn } from \"./lib/utils\"\nimport { LoaderIcon } from \"./lib/internal-icons\"\n\ntype SpinnerProps = React.ComponentProps<\"svg\">\n\nfunction Spinner({ className, ...props }: SpinnerProps) {\n return (\n <LoaderIcon
|
|
1
|
+
{"version":3,"file":"spinner.js","names":[],"sources":["../src/spinner.tsx"],"sourcesContent":["import { cn } from \"./lib/utils\"\nimport { LoaderIcon } from \"./lib/internal-icons\"\n\ntype SpinnerProps = React.ComponentProps<\"svg\">\n\nfunction Spinner({ className, ...props }: SpinnerProps) {\n return (\n <LoaderIcon\n data-slot=\"spinner\"\n role=\"status\"\n aria-label=\"Loading\"\n // The spinner IS the accessible status, so it opts out of the\n // decorative-by-default aria-hidden that internal icons carry.\n aria-hidden={false}\n className={cn(\"size-4 animate-spin\", className)}\n {...props}\n />\n )\n}\n\nexport { Spinner }\n"],"mappings":";;;;AAKA,SAAS,QAAQ,EAAE,WAAW,GAAG,SAAuB;AACtD,QACE,oBAAC,YAAD;EACE,aAAU;EACV,MAAK;EACL,cAAW;EAGX,eAAa;EACb,WAAW,GAAG,uBAAuB,UAAU;EAC/C,GAAI;EACJ,CAAA"}
|
package/dist/styles.css
CHANGED
|
@@ -33,17 +33,17 @@
|
|
|
33
33
|
|
|
34
34
|
/* Wave — brand ramp. 500 = Wave Blue #0074DE.
|
|
35
35
|
* A true cobalt signal: calm, trustable, solid, constant. */
|
|
36
|
-
--wave-50: #EEF8FF
|
|
37
|
-
--wave-100: #D6EEFF
|
|
38
|
-
--wave-200: #AEDDFF
|
|
39
|
-
--wave-300: #7BC3FF
|
|
40
|
-
--wave-400: #3EA3FF
|
|
41
|
-
--wave-500: #0074DE
|
|
42
|
-
--wave-600: #0061C6
|
|
43
|
-
--wave-700: #004C9F
|
|
44
|
-
--wave-800: #003976
|
|
45
|
-
--wave-900: #042954
|
|
46
|
-
--wave-950: #061C37
|
|
36
|
+
--wave-50: oklch(0.974 0.014 238); /* #EEF8FF */
|
|
37
|
+
--wave-100: oklch(0.937 0.034 239); /* #D6EEFF */
|
|
38
|
+
--wave-200: oklch(0.876 0.068 240); /* #AEDDFF */
|
|
39
|
+
--wave-300: oklch(0.793 0.112 245); /* #7BC3FF */
|
|
40
|
+
--wave-400: oklch(0.700 0.164 250); /* #3EA3FF */
|
|
41
|
+
--wave-500: oklch(0.566 0.184 255); /* #0074DE */
|
|
42
|
+
--wave-600: oklch(0.506 0.175 256); /* #0061C6 */
|
|
43
|
+
--wave-700: oklch(0.429 0.150 257); /* #004C9F */
|
|
44
|
+
--wave-800: oklch(0.351 0.118 255); /* #003976 */
|
|
45
|
+
--wave-900: oklch(0.284 0.088 255); /* #042954 */
|
|
46
|
+
--wave-950: oklch(0.226 0.060 255); /* #061C37 */
|
|
47
47
|
|
|
48
48
|
/* ── Neutral theme palettes (primitives) ─────────────────────────────────
|
|
49
49
|
* Three complete neutral ramps, one per theme. The theme class on <html>
|
|
@@ -53,45 +53,45 @@
|
|
|
53
53
|
* ──────────────────────────────────────────────────────────────────────── */
|
|
54
54
|
|
|
55
55
|
/* Graphite — neutral grey (default) */
|
|
56
|
-
--graphite-50: #FAFAFB
|
|
57
|
-
--graphite-100: #F3F3F4
|
|
58
|
-
--graphite-200: #E5E5E8
|
|
59
|
-
--graphite-300: #D1D2D7
|
|
60
|
-
--graphite-400: #ABACB2
|
|
61
|
-
--graphite-500: #8B8C94
|
|
62
|
-
--graphite-600: #6C6D76
|
|
63
|
-
--graphite-700: #4C4D55
|
|
64
|
-
--graphite-800: #3B3C44
|
|
65
|
-
--graphite-900: #323339
|
|
66
|
-
--graphite-950: #2C2D32
|
|
56
|
+
--graphite-50: oklch(0.985 0.001 286); /* #FAFAFB */
|
|
57
|
+
--graphite-100: oklch(0.964 0.001 286); /* #F3F3F4 */
|
|
58
|
+
--graphite-200: oklch(0.923 0.004 286); /* #E5E5E8 */
|
|
59
|
+
--graphite-300: oklch(0.864 0.007 277); /* #D1D2D7 */
|
|
60
|
+
--graphite-400: oklch(0.745 0.009 279); /* #ABACB2 */
|
|
61
|
+
--graphite-500: oklch(0.642 0.012 280); /* #8B8C94 */
|
|
62
|
+
--graphite-600: oklch(0.537 0.014 281); /* #6C6D76 */
|
|
63
|
+
--graphite-700: oklch(0.422 0.013 280); /* #4C4D55 */
|
|
64
|
+
--graphite-800: oklch(0.358 0.014 280); /* #3B3C44 */
|
|
65
|
+
--graphite-900: oklch(0.322 0.011 278); /* #323339 */
|
|
66
|
+
--graphite-950: oklch(0.298 0.009 277); /* #2C2D32 */
|
|
67
67
|
|
|
68
68
|
/* Ink — deep navy surfaces, neutral-cool structure (page #020812, surface #050F1E).
|
|
69
69
|
* Chroma fades from full navy at the dark surfaces to near-neutral at the light
|
|
70
70
|
* end, so text/borders read as a distinct layer rather than melting into navy. */
|
|
71
|
-
--ink-50: #F2F4F6
|
|
72
|
-
--ink-100: #DFE1E5
|
|
73
|
-
--ink-200: #C5C9CE
|
|
74
|
-
--ink-300: #AAAFB6
|
|
75
|
-
--ink-400: #8C929A
|
|
76
|
-
--ink-500: #6E747D
|
|
77
|
-
--ink-600: #4F5763
|
|
78
|
-
--ink-700: #323D4C
|
|
79
|
-
--ink-800: #162336
|
|
80
|
-
--ink-900: #050F1E
|
|
81
|
-
--ink-950: #020812
|
|
71
|
+
--ink-50: oklch(0.966 0.003 248); /* #F2F4F6 */
|
|
72
|
+
--ink-100: oklch(0.909 0.006 265); /* #DFE1E5 */
|
|
73
|
+
--ink-200: oklch(0.834 0.008 254); /* #C5C9CE */
|
|
74
|
+
--ink-300: oklch(0.752 0.011 257); /* #AAAFB6 */
|
|
75
|
+
--ink-400: oklch(0.658 0.014 256); /* #8C929A */
|
|
76
|
+
--ink-500: oklch(0.557 0.016 258); /* #6E747D */
|
|
77
|
+
--ink-600: oklch(0.454 0.022 258); /* #4F5763 */
|
|
78
|
+
--ink-700: oklch(0.356 0.030 256); /* #323D4C */
|
|
79
|
+
--ink-800: oklch(0.254 0.041 258); /* #162336 */
|
|
80
|
+
--ink-900: oklch(0.168 0.036 257); /* #050F1E */
|
|
81
|
+
--ink-950: oklch(0.132 0.027 252); /* #020812 */
|
|
82
82
|
|
|
83
83
|
/* Paper — cool near-neutral (anchor #EFF0EB @ 200 = foundation) */
|
|
84
|
-
--paper-50: #FCFDFA
|
|
85
|
-
--paper-100: #F6F7F3
|
|
86
|
-
--paper-200: #EFF0EB
|
|
87
|
-
--paper-300: #D7D8D2
|
|
88
|
-
--paper-400: #AAACA5
|
|
89
|
-
--paper-500: #83847D
|
|
90
|
-
--paper-600: #63645E
|
|
91
|
-
--paper-700: #494A44
|
|
92
|
-
--paper-800: #30312C
|
|
93
|
-
--paper-900: #1B1C18
|
|
94
|
-
--paper-950: #0C0D09
|
|
84
|
+
--paper-50: oklch(0.992 0.004 122); /* #FCFDFA */
|
|
85
|
+
--paper-100: oklch(0.974 0.005 118); /* #F6F7F3 */
|
|
86
|
+
--paper-200: oklch(0.953 0.007 116); /* #EFF0EB */
|
|
87
|
+
--paper-300: oklch(0.880 0.008 114); /* #D7D8D2 */
|
|
88
|
+
--paper-400: oklch(0.741 0.010 120); /* #AAACA5 */
|
|
89
|
+
--paper-500: oklch(0.610 0.010 113); /* #83847D */
|
|
90
|
+
--paper-600: oklch(0.500 0.009 114); /* #63645E */
|
|
91
|
+
--paper-700: oklch(0.406 0.010 115); /* #494A44 */
|
|
92
|
+
--paper-800: oklch(0.310 0.009 116); /* #30312C */
|
|
93
|
+
--paper-900: oklch(0.224 0.008 118); /* #1B1C18 */
|
|
94
|
+
--paper-950: oklch(0.156 0.008 119); /* #0C0D09 */
|
|
95
95
|
|
|
96
96
|
/* Active neutral alias — the theme class on <html> repoints these to one of
|
|
97
97
|
* the ramps above (step 3). Default (no theme class) = Graphite. The semantic
|
|
@@ -146,12 +146,12 @@
|
|
|
146
146
|
/* Rings = brand themed */
|
|
147
147
|
--focus: var(--primary);
|
|
148
148
|
|
|
149
|
-
/* Shadow — two dials for the layered `shadow-*` scale: `--shadow-color` (
|
|
150
|
-
* components — a deep cool-tinted near-black, never pure
|
|
151
|
-
* heavy) and `--shadow-strength` (per-layer alpha / intensity). Both
|
|
152
|
-
* per :root/.dark, so retinting OR dimming every shadow is one token.
|
|
153
|
-
* colored surface set a named tint, e.g. `--shadow-color-primary`. */
|
|
154
|
-
--shadow-color:
|
|
149
|
+
/* Shadow — two dials for the layered `shadow-*` scale: `--shadow-color` (oklch
|
|
150
|
+
* components `L C H` — a deep cool-tinted near-black, never pure black which
|
|
151
|
+
* reads heavy) and `--shadow-strength` (per-layer alpha / intensity). Both
|
|
152
|
+
* resolve per :root/.dark, so retinting OR dimming every shadow is one token.
|
|
153
|
+
* For a colored surface set a named tint, e.g. `--shadow-color-primary`. */
|
|
154
|
+
--shadow-color: 0.159 0.021 263; /* was hsl(220 45% 6%) */
|
|
155
155
|
--shadow-strength: 0.22;
|
|
156
156
|
|
|
157
157
|
/* Status */
|
|
@@ -238,7 +238,7 @@
|
|
|
238
238
|
|
|
239
239
|
/* Shadow — darker tint, lower strength: a near-black shadow on a dark
|
|
240
240
|
* surface reads heavier than on white, so dim it. */
|
|
241
|
-
--shadow-color:
|
|
241
|
+
--shadow-color: 0.125 0.011 259; /* was hsl(220 40% 3%) */
|
|
242
242
|
--shadow-strength: 0.18;
|
|
243
243
|
|
|
244
244
|
/* Status */
|
|
@@ -347,23 +347,23 @@
|
|
|
347
347
|
* Overrides Tailwind's shadow-sm/md/lg. */
|
|
348
348
|
@theme {
|
|
349
349
|
--shadow-sm:
|
|
350
|
-
0px 0.5px 0.7px
|
|
351
|
-
0px 0.8px 1px -1.2px
|
|
352
|
-
0px 2px 2.5px -2.5px
|
|
350
|
+
0px 0.5px 0.7px oklch(var(--shadow-color) / var(--shadow-strength)),
|
|
351
|
+
0px 0.8px 1px -1.2px oklch(var(--shadow-color) / var(--shadow-strength)),
|
|
352
|
+
0px 2px 2.5px -2.5px oklch(var(--shadow-color) / var(--shadow-strength));
|
|
353
353
|
--shadow-md:
|
|
354
|
-
0px 0.5px 0.7px
|
|
355
|
-
0px 1.6px 2px -0.8px
|
|
356
|
-
0px 4.1px 5.2px -1.7px
|
|
357
|
-
0px 10px 12.6px -2.5px
|
|
354
|
+
0px 0.5px 0.7px oklch(var(--shadow-color) / var(--shadow-strength)),
|
|
355
|
+
0px 1.6px 2px -0.8px oklch(var(--shadow-color) / var(--shadow-strength)),
|
|
356
|
+
0px 4.1px 5.2px -1.7px oklch(var(--shadow-color) / var(--shadow-strength)),
|
|
357
|
+
0px 10px 12.6px -2.5px oklch(var(--shadow-color) / var(--shadow-strength));
|
|
358
358
|
--shadow-lg:
|
|
359
|
-
0px 0.5px 0.7px
|
|
360
|
-
0px 2.9px 3.7px -0.4px
|
|
361
|
-
0px 5.4px 6.8px -0.7px
|
|
362
|
-
0px 8.9px 11.2px -1.1px
|
|
363
|
-
0px 14.3px 18px -1.4px
|
|
364
|
-
0px 22.3px 28.1px -1.8px
|
|
365
|
-
0px 33.9px 42.7px -2.1px
|
|
366
|
-
0px 50px 62.9px -2.5px
|
|
359
|
+
0px 0.5px 0.7px oklch(var(--shadow-color) / var(--shadow-strength)),
|
|
360
|
+
0px 2.9px 3.7px -0.4px oklch(var(--shadow-color) / var(--shadow-strength)),
|
|
361
|
+
0px 5.4px 6.8px -0.7px oklch(var(--shadow-color) / var(--shadow-strength)),
|
|
362
|
+
0px 8.9px 11.2px -1.1px oklch(var(--shadow-color) / var(--shadow-strength)),
|
|
363
|
+
0px 14.3px 18px -1.4px oklch(var(--shadow-color) / var(--shadow-strength)),
|
|
364
|
+
0px 22.3px 28.1px -1.8px oklch(var(--shadow-color) / var(--shadow-strength)),
|
|
365
|
+
0px 33.9px 42.7px -2.1px oklch(var(--shadow-color) / var(--shadow-strength)),
|
|
366
|
+
0px 50px 62.9px -2.5px oklch(var(--shadow-color) / var(--shadow-strength));
|
|
367
367
|
}
|
|
368
368
|
|
|
369
369
|
/* ---------------------------------------------------------------------------
|
package/dist/textarea.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"textarea.d.ts","names":[],"sources":["../src/textarea.tsx"],"mappings":";;;;
|
|
1
|
+
{"version":3,"file":"textarea.d.ts","names":[],"sources":["../src/textarea.tsx"],"mappings":";;;;KAMK,aAAA,GAAgB,IAAA,CAAK,KAAA,CAAM,cAAA;EAC9B,QAAA,GAAW,KAAA,CAAM,kBAAA,CAAmB,mBAAA;EACpC,aAAA,IAAiB,KAAA;AAAA;AAAA,iBAGV,QAAA,CAAA;EAAW,SAAA;EAAW,QAAA;EAAU,aAAA;EAAA,GAAkB;AAAA,GAAS,aAAA,GAAa,oBAAA,CAAA,GAAA,CAAA,OAAA"}
|
package/dist/textarea.js
CHANGED
package/dist/textarea.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"textarea.js","names":[],"sources":["../src/textarea.tsx"],"sourcesContent":["
|
|
1
|
+
{"version":3,"file":"textarea.js","names":[],"sources":["../src/textarea.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\n\nimport { cn } from \"./lib/utils\"\n\ntype TextareaProps = Omit<React.ComponentProps<\"textarea\">, \"onChange\"> & {\n onChange?: React.ChangeEventHandler<HTMLTextAreaElement>\n onValueChange?: (value: string) => void\n}\n\nfunction Textarea({ className, onChange, onValueChange, ...props }: TextareaProps) {\n function handleChange(e: React.ChangeEvent<HTMLTextAreaElement>) {\n onChange?.(e)\n onValueChange?.(e.target.value)\n }\n\n return (\n <textarea\n data-slot=\"textarea\"\n className={cn(\n \"border-edge dark:bg-edge/30 focus-visible:border-focus focus-visible:ring-focus/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 resize-none disabled:bg-edge/50 disabled:cursor-not-allowed dark:disabled:bg-edge/80 placeholder:text-soft flex field-sizing-content min-h-16 w-full rounded-md border bg-transparent px-2.5 py-2 text-base transition-colors outline-none focus-visible:ring-3 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:ring-3 md:text-sm\",\n className,\n )}\n onChange={handleChange}\n {...props}\n />\n )\n}\n\nexport { Textarea }\n"],"mappings":";;;;;AAWA,SAAS,SAAS,EAAE,WAAW,UAAU,eAAe,GAAG,SAAwB;CACjF,SAAS,aAAa,GAA2C;AAC/D,aAAW,EAAE;AACb,kBAAgB,EAAE,OAAO,MAAM;;AAGjC,QACE,oBAAC,YAAD;EACE,aAAU;EACV,WAAW,GACT,ojBACA,UACD;EACD,UAAU;EACV,GAAI;EACJ,CAAA"}
|
package/dist/toast.d.ts
CHANGED
|
@@ -7,7 +7,7 @@ import * as _$_base_ui_react0 from "@base-ui/react";
|
|
|
7
7
|
//#region src/toast.d.ts
|
|
8
8
|
declare const toastRootClass = "bg-elevated text-contrast ring-contrast/10 rounded-md p-4 text-sm shadow-md ring-1 outline-none select-none";
|
|
9
9
|
declare const toastIconVariants: (props?: ({
|
|
10
|
-
type?: "
|
|
10
|
+
type?: "success" | "loading" | "info" | "warning" | "error" | null | undefined;
|
|
11
11
|
} & _$class_variance_authority_types0.ClassProp) | undefined) => string;
|
|
12
12
|
declare const toastViewportVariants: (props?: ({
|
|
13
13
|
position?: "top-left" | "top-center" | "top-right" | "bottom-left" | "bottom-center" | "bottom-right" | null | undefined;
|
package/dist/toggle-group.d.ts
CHANGED
|
@@ -7,7 +7,6 @@ import { ToggleGroup as ToggleGroup$1 } from "@base-ui/react/toggle-group";
|
|
|
7
7
|
//#region src/toggle-group.d.ts
|
|
8
8
|
type ToggleGroupProps = ToggleGroup$1.Props & VariantProps<typeof toggleVariants> & {
|
|
9
9
|
spacing?: number;
|
|
10
|
-
orientation?: "horizontal" | "vertical";
|
|
11
10
|
};
|
|
12
11
|
type ToggleGroupItemProps = Toggle.Props & VariantProps<typeof toggleVariants>;
|
|
13
12
|
declare function ToggleGroup({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"toggle-group.d.ts","names":[],"sources":["../src/toggle-group.tsx"],"mappings":";;;;;;;KAeK,gBAAA,GAAmB,aAAA,CAAqB,KAAA,GAC3C,YAAA,QAAoB,cAAA;EAClB,OAAA;
|
|
1
|
+
{"version":3,"file":"toggle-group.d.ts","names":[],"sources":["../src/toggle-group.tsx"],"mappings":";;;;;;;KAeK,gBAAA,GAAmB,aAAA,CAAqB,KAAA,GAC3C,YAAA,QAAoB,cAAA;EAClB,OAAA;AAAA;AAAA,KAGC,oBAAA,GAAuB,MAAA,CAAgB,KAAA,GAC1C,YAAA,QAAoB,cAAA;AAAA,iBASb,WAAA,CAAA;EACP,SAAA;EACA,OAAA;EACA,IAAA;EACA,OAAA;EACA,WAAA;EACA,QAAA;EAAA,GACG;AAAA,GACF,gBAAA,GAAgB,oBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAwBV,eAAA,CAAA;EACP,SAAA;EACA,QAAA;EACA,OAAA;EACA,IAAA;EAAA,GACG;AAAA,GACF,oBAAA,GAAoB,oBAAA,CAAA,GAAA,CAAA,OAAA"}
|
package/dist/toggle-group.js
CHANGED
|
@@ -14,11 +14,11 @@ const ToggleGroupContext = React.createContext({
|
|
|
14
14
|
});
|
|
15
15
|
function ToggleGroup({ className, variant, size, spacing = 0, orientation = "horizontal", children, ...props }) {
|
|
16
16
|
return /* @__PURE__ */ jsx(ToggleGroup$1, {
|
|
17
|
+
orientation,
|
|
17
18
|
"data-slot": "toggle-group",
|
|
18
19
|
"data-variant": variant,
|
|
19
20
|
"data-size": size,
|
|
20
21
|
"data-spacing": spacing,
|
|
21
|
-
"data-orientation": orientation,
|
|
22
22
|
style: { "--gap": spacing },
|
|
23
23
|
className: cn("group/toggle-group flex w-fit flex-row items-center gap-[--spacing(var(--gap))] rounded-md data-[orientation=vertical]:flex-col data-[orientation=vertical]:items-stretch data-[size=sm]:rounded-sm", className),
|
|
24
24
|
...props,
|
package/dist/toggle-group.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"toggle-group.js","names":["ToggleGroupPrimitive","TogglePrimitive"],"sources":["../src/toggle-group.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { Toggle as TogglePrimitive } from \"@base-ui/react/toggle\"\nimport { ToggleGroup as ToggleGroupPrimitive } from \"@base-ui/react/toggle-group\"\nimport { type VariantProps } from \"class-variance-authority\"\n\nimport { toggleVariants } from \"./toggle\"\nimport { cn } from \"./lib/utils\"\n\ntype ToggleGroupContextValue = VariantProps<typeof toggleVariants> & {\n spacing?: number\n orientation?: \"horizontal\" | \"vertical\"\n}\n\ntype ToggleGroupProps = ToggleGroupPrimitive.Props &\n VariantProps<typeof toggleVariants> & {\n spacing?: number\n
|
|
1
|
+
{"version":3,"file":"toggle-group.js","names":["ToggleGroupPrimitive","TogglePrimitive"],"sources":["../src/toggle-group.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { Toggle as TogglePrimitive } from \"@base-ui/react/toggle\"\nimport { ToggleGroup as ToggleGroupPrimitive } from \"@base-ui/react/toggle-group\"\nimport { type VariantProps } from \"class-variance-authority\"\n\nimport { toggleVariants } from \"./toggle\"\nimport { cn } from \"./lib/utils\"\n\ntype ToggleGroupContextValue = VariantProps<typeof toggleVariants> & {\n spacing?: number\n orientation?: \"horizontal\" | \"vertical\"\n}\n\ntype ToggleGroupProps = ToggleGroupPrimitive.Props &\n VariantProps<typeof toggleVariants> & {\n spacing?: number\n }\n\ntype ToggleGroupItemProps = TogglePrimitive.Props &\n VariantProps<typeof toggleVariants>\n\nconst ToggleGroupContext = React.createContext<ToggleGroupContextValue>({\n size: \"default\",\n variant: \"default\",\n spacing: 0,\n orientation: \"horizontal\",\n})\n\nfunction ToggleGroup({\n className,\n variant,\n size,\n spacing = 0,\n orientation = \"horizontal\",\n children,\n ...props\n}: ToggleGroupProps) {\n return (\n <ToggleGroupPrimitive\n orientation={orientation}\n data-slot=\"toggle-group\"\n data-variant={variant}\n data-size={size}\n data-spacing={spacing}\n style={{ \"--gap\": spacing } as React.CSSProperties}\n className={cn(\n \"group/toggle-group flex w-fit flex-row items-center gap-[--spacing(var(--gap))] rounded-md data-[orientation=vertical]:flex-col data-[orientation=vertical]:items-stretch data-[size=sm]:rounded-sm\",\n className\n )}\n {...props}\n >\n <ToggleGroupContext.Provider\n value={{ variant, size, spacing, orientation }}\n >\n {children}\n </ToggleGroupContext.Provider>\n </ToggleGroupPrimitive>\n )\n}\n\nfunction ToggleGroupItem({\n className,\n children,\n variant = \"default\",\n size = \"default\",\n ...props\n}: ToggleGroupItemProps) {\n const context = React.useContext(ToggleGroupContext)\n\n return (\n <TogglePrimitive\n data-slot=\"toggle-group-item\"\n data-variant={context.variant || variant}\n data-size={context.size || size}\n data-spacing={context.spacing}\n className={cn(\n \"shrink-0 group-data-[spacing=0]/toggle-group:rounded-none group-data-[spacing=0]/toggle-group:px-2 focus:z-10 focus-visible:z-10 group-data-[orientation=horizontal]/toggle-group:data-[spacing=0]:first:rounded-l-md group-data-[orientation=vertical]/toggle-group:data-[spacing=0]:first:rounded-t-md group-data-[orientation=horizontal]/toggle-group:data-[spacing=0]:last:rounded-r-md group-data-[orientation=vertical]/toggle-group:data-[spacing=0]:last:rounded-b-md group-data-[orientation=horizontal]/toggle-group:data-[spacing=0]:data-[variant=outline]:border-l-0 group-data-[orientation=vertical]/toggle-group:data-[spacing=0]:data-[variant=outline]:border-t-0 group-data-[orientation=horizontal]/toggle-group:data-[spacing=0]:data-[variant=outline]:first:border-l group-data-[orientation=vertical]/toggle-group:data-[spacing=0]:data-[variant=outline]:first:border-t\",\n toggleVariants({\n variant: context.variant || variant,\n size: context.size || size,\n }),\n className\n )}\n {...props}\n >\n {children}\n </TogglePrimitive>\n )\n}\n\nexport { ToggleGroup, ToggleGroupItem }\n"],"mappings":";;;;;;;;AAuBA,MAAM,qBAAqB,MAAM,cAAuC;CACtE,MAAM;CACN,SAAS;CACT,SAAS;CACT,aAAa;CACd,CAAC;AAEF,SAAS,YAAY,EACnB,WACA,SACA,MACA,UAAU,GACV,cAAc,cACd,UACA,GAAG,SACgB;AACnB,QACE,oBAACA,eAAD;EACe;EACb,aAAU;EACV,gBAAc;EACd,aAAW;EACX,gBAAc;EACd,OAAO,EAAE,SAAS,SAAS;EAC3B,WAAW,GACT,uMACA,UACD;EACD,GAAI;YAEJ,oBAAC,mBAAmB,UAApB;GACE,OAAO;IAAE;IAAS;IAAM;IAAS;IAAa;GAE7C;GAC2B,CAAA;EACT,CAAA;;AAI3B,SAAS,gBAAgB,EACvB,WACA,UACA,UAAU,WACV,OAAO,WACP,GAAG,SACoB;CACvB,MAAM,UAAU,MAAM,WAAW,mBAAmB;AAEpD,QACE,oBAACC,QAAD;EACE,aAAU;EACV,gBAAc,QAAQ,WAAW;EACjC,aAAW,QAAQ,QAAQ;EAC3B,gBAAc,QAAQ;EACtB,WAAW,GACT,s2BACA,eAAe;GACb,SAAS,QAAQ,WAAW;GAC5B,MAAM,QAAQ,QAAQ;GACvB,CAAC,EACF,UACD;EACD,GAAI;EAEH;EACe,CAAA"}
|