@northslopetech/altitude-ui 3.0.0-alpha.8 → 3.0.0-alpha.9
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/dist/index.d.mts +2 -2
- package/dist/index.d.ts +2 -2
- package/dist/index.js +85 -8
- package/dist/index.mjs +85 -8
- package/package.json +2 -2
package/dist/index.d.mts
CHANGED
|
@@ -625,11 +625,11 @@ declare const AlertDialogDescription: React$1.ForwardRefExoticComponent<Omit<Omi
|
|
|
625
625
|
/**
|
|
626
626
|
* Primary action button. Closes the dialog on click. Defaults to the `primary` variant.
|
|
627
627
|
*/
|
|
628
|
-
declare const AlertDialogAction: React$1.ForwardRefExoticComponent<Omit<_base_ui_react.DialogCloseProps & Pick<ButtonProps, "
|
|
628
|
+
declare const AlertDialogAction: React$1.ForwardRefExoticComponent<Omit<_base_ui_react.DialogCloseProps & Pick<ButtonProps, "size" | "variant">, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
|
|
629
629
|
/**
|
|
630
630
|
* Cancel / dismiss button. Closes the dialog on click. Defaults to the `default` variant.
|
|
631
631
|
*/
|
|
632
|
-
declare const AlertDialogCancel: React$1.ForwardRefExoticComponent<Omit<_base_ui_react.DialogCloseProps & Pick<ButtonProps, "
|
|
632
|
+
declare const AlertDialogCancel: React$1.ForwardRefExoticComponent<Omit<_base_ui_react.DialogCloseProps & Pick<ButtonProps, "size" | "variant">, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
|
|
633
633
|
|
|
634
634
|
/**
|
|
635
635
|
* Wrapper that provides `role="list"` semantics and adjusts gap spacing
|
package/dist/index.d.ts
CHANGED
|
@@ -625,11 +625,11 @@ declare const AlertDialogDescription: React$1.ForwardRefExoticComponent<Omit<Omi
|
|
|
625
625
|
/**
|
|
626
626
|
* Primary action button. Closes the dialog on click. Defaults to the `primary` variant.
|
|
627
627
|
*/
|
|
628
|
-
declare const AlertDialogAction: React$1.ForwardRefExoticComponent<Omit<_base_ui_react.DialogCloseProps & Pick<ButtonProps, "
|
|
628
|
+
declare const AlertDialogAction: React$1.ForwardRefExoticComponent<Omit<_base_ui_react.DialogCloseProps & Pick<ButtonProps, "size" | "variant">, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
|
|
629
629
|
/**
|
|
630
630
|
* Cancel / dismiss button. Closes the dialog on click. Defaults to the `default` variant.
|
|
631
631
|
*/
|
|
632
|
-
declare const AlertDialogCancel: React$1.ForwardRefExoticComponent<Omit<_base_ui_react.DialogCloseProps & Pick<ButtonProps, "
|
|
632
|
+
declare const AlertDialogCancel: React$1.ForwardRefExoticComponent<Omit<_base_ui_react.DialogCloseProps & Pick<ButtonProps, "size" | "variant">, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
|
|
633
633
|
|
|
634
634
|
/**
|
|
635
635
|
* Wrapper that provides `role="list"` semantics and adjusts gap spacing
|
package/dist/index.js
CHANGED
|
@@ -282,8 +282,83 @@ var import_class_variance_authority2 = require("class-variance-authority");
|
|
|
282
282
|
var import_clsx = require("clsx");
|
|
283
283
|
var import_tailwind_merge = require("tailwind-merge");
|
|
284
284
|
var import_class_variance_authority = require("class-variance-authority");
|
|
285
|
+
var twMerge = (0, import_tailwind_merge.extendTailwindMerge)({
|
|
286
|
+
extend: {
|
|
287
|
+
classGroups: {
|
|
288
|
+
"bg-color": [
|
|
289
|
+
// sidebar tokens
|
|
290
|
+
"sidebar-default",
|
|
291
|
+
"sidebar-item",
|
|
292
|
+
// surface tokens
|
|
293
|
+
"surface-default",
|
|
294
|
+
"surface-secondary",
|
|
295
|
+
"surface-muted",
|
|
296
|
+
"surface-inverse",
|
|
297
|
+
"surface-success",
|
|
298
|
+
"surface-error",
|
|
299
|
+
"surface-warning",
|
|
300
|
+
"surface-info",
|
|
301
|
+
"surface-accent",
|
|
302
|
+
"surface-overlay",
|
|
303
|
+
// interactive tokens
|
|
304
|
+
"interactive-default",
|
|
305
|
+
"interactive-accent",
|
|
306
|
+
"interactive-secondary",
|
|
307
|
+
"interactive-destructive",
|
|
308
|
+
"interactive-hover",
|
|
309
|
+
"interactive-active",
|
|
310
|
+
// bg-* tokens
|
|
311
|
+
"bg-default",
|
|
312
|
+
"bg-inverse",
|
|
313
|
+
"bg-dark",
|
|
314
|
+
"bg-light",
|
|
315
|
+
"bg-primary",
|
|
316
|
+
"bg-secondary",
|
|
317
|
+
"bg-destructive",
|
|
318
|
+
"bg-gray",
|
|
319
|
+
"bg-surface-secondary",
|
|
320
|
+
"bg-error",
|
|
321
|
+
"bg-error-subtle",
|
|
322
|
+
"bg-info",
|
|
323
|
+
"bg-info-subtle",
|
|
324
|
+
"bg-success",
|
|
325
|
+
"bg-success-subtle",
|
|
326
|
+
"bg-warning",
|
|
327
|
+
"bg-warning-subtle",
|
|
328
|
+
"bg-interactive-primary",
|
|
329
|
+
"bg-interactive-primary-hover",
|
|
330
|
+
"bg-interactive-secondary",
|
|
331
|
+
"bg-interactive-secondary-hover",
|
|
332
|
+
"bg-interactive-error",
|
|
333
|
+
"bg-interactive-error-hover",
|
|
334
|
+
"bg-interactive-error-subtle",
|
|
335
|
+
"bg-interactive-info",
|
|
336
|
+
"bg-interactive-success",
|
|
337
|
+
"bg-interactive-warning"
|
|
338
|
+
],
|
|
339
|
+
"text-color": [
|
|
340
|
+
// sidebar tokens
|
|
341
|
+
"sidebar-foreground",
|
|
342
|
+
"sidebar-item-fg",
|
|
343
|
+
// interactive foreground tokens
|
|
344
|
+
"interactive-default-fg",
|
|
345
|
+
"interactive-accent-fg",
|
|
346
|
+
"interactive-secondary-fg",
|
|
347
|
+
"interactive-destructive-fg",
|
|
348
|
+
// text-* tokens
|
|
349
|
+
"text-default",
|
|
350
|
+
"text-dark",
|
|
351
|
+
"text-light",
|
|
352
|
+
"text-interactive-error",
|
|
353
|
+
"text-interactive-info",
|
|
354
|
+
"text-interactive-success",
|
|
355
|
+
"text-interactive-warning"
|
|
356
|
+
]
|
|
357
|
+
}
|
|
358
|
+
}
|
|
359
|
+
});
|
|
285
360
|
function cn(...inputs) {
|
|
286
|
-
return
|
|
361
|
+
return twMerge((0, import_clsx.clsx)(inputs));
|
|
287
362
|
}
|
|
288
363
|
|
|
289
364
|
// src/components/ui/alert.tsx
|
|
@@ -1914,7 +1989,7 @@ var Sidebar = React14.forwardRef(
|
|
|
1914
1989
|
"aside",
|
|
1915
1990
|
{
|
|
1916
1991
|
ref,
|
|
1917
|
-
className: "group peer
|
|
1992
|
+
className: "group peer sidebar-foreground",
|
|
1918
1993
|
"data-state": state,
|
|
1919
1994
|
"data-collapsible": state === "collapsed" ? collapsible : "",
|
|
1920
1995
|
"aria-label": "Main navigation",
|
|
@@ -1935,15 +2010,17 @@ var Sidebar = React14.forwardRef(
|
|
|
1935
2010
|
{
|
|
1936
2011
|
className: cn(
|
|
1937
2012
|
"fixed inset-y-0 z-10 h-svh w-[var(--sidebar-width)] transition-[left,right,width] duration-200 ease-linear flex left-0",
|
|
1938
|
-
"group-data-[collapsible=icon]:w-[var(--sidebar-width-icon)]"
|
|
1939
|
-
className
|
|
2013
|
+
"group-data-[collapsible=icon]:w-[var(--sidebar-width-icon)]"
|
|
1940
2014
|
),
|
|
1941
|
-
...props,
|
|
1942
2015
|
children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
1943
2016
|
"div",
|
|
1944
2017
|
{
|
|
1945
2018
|
"data-sidebar": "sidebar",
|
|
1946
|
-
className:
|
|
2019
|
+
className: cn(
|
|
2020
|
+
"flex h-full w-full flex-col gap-8 p-4 px-2 sidebar-default",
|
|
2021
|
+
className
|
|
2022
|
+
),
|
|
2023
|
+
...props,
|
|
1947
2024
|
children
|
|
1948
2025
|
}
|
|
1949
2026
|
)
|
|
@@ -1962,7 +2039,7 @@ var SidebarInset = React14.forwardRef(
|
|
|
1962
2039
|
{
|
|
1963
2040
|
ref,
|
|
1964
2041
|
className: cn(
|
|
1965
|
-
"relative flex min-h-svh flex-1 flex-col bg-
|
|
2042
|
+
"relative flex min-h-svh flex-1 flex-col bg-[var(--color-bg-default)]",
|
|
1966
2043
|
className
|
|
1967
2044
|
),
|
|
1968
2045
|
...props
|
|
@@ -2078,7 +2155,7 @@ var SidebarMenuButton = React14.forwardRef(({ isActive = false, tooltip, classNa
|
|
|
2078
2155
|
"data-active": isActive,
|
|
2079
2156
|
"aria-current": isActive ? "page" : void 0,
|
|
2080
2157
|
className: cn(
|
|
2081
|
-
"peer/menu-button flex w-full h-8 items-center gap-2 overflow-hidden rounded-lg p-2 text-left outline-none transition-[width,height,padding] hover:bg-white/10 data-[active=true]:
|
|
2158
|
+
"peer/menu-button flex w-full h-8 items-center gap-2 overflow-hidden rounded-lg p-2 text-left outline-none transition-[width,height,padding] hover:bg-white/10 data-[active=true]:sidebar-item data-[active=true]:sidebar-item-fg data-[active=true]:hover:sidebar-item group-data-[collapsible=icon]:!size-8 group-data-[collapsible=icon]:!p-2 group-data-[collapsible=icon]:!gap-2 group-data-[collapsible=icon]:[&>*:not(svg)]:hidden [&>*:last-child]:truncate [&>svg]:shrink-0",
|
|
2082
2159
|
className
|
|
2083
2160
|
),
|
|
2084
2161
|
...props,
|
package/dist/index.mjs
CHANGED
|
@@ -4,8 +4,83 @@ import { cva as cva2 } from "class-variance-authority";
|
|
|
4
4
|
|
|
5
5
|
// src/lib/utils.ts
|
|
6
6
|
import { clsx } from "clsx";
|
|
7
|
-
import {
|
|
7
|
+
import { extendTailwindMerge } from "tailwind-merge";
|
|
8
8
|
import { cva } from "class-variance-authority";
|
|
9
|
+
var twMerge = extendTailwindMerge({
|
|
10
|
+
extend: {
|
|
11
|
+
classGroups: {
|
|
12
|
+
"bg-color": [
|
|
13
|
+
// sidebar tokens
|
|
14
|
+
"sidebar-default",
|
|
15
|
+
"sidebar-item",
|
|
16
|
+
// surface tokens
|
|
17
|
+
"surface-default",
|
|
18
|
+
"surface-secondary",
|
|
19
|
+
"surface-muted",
|
|
20
|
+
"surface-inverse",
|
|
21
|
+
"surface-success",
|
|
22
|
+
"surface-error",
|
|
23
|
+
"surface-warning",
|
|
24
|
+
"surface-info",
|
|
25
|
+
"surface-accent",
|
|
26
|
+
"surface-overlay",
|
|
27
|
+
// interactive tokens
|
|
28
|
+
"interactive-default",
|
|
29
|
+
"interactive-accent",
|
|
30
|
+
"interactive-secondary",
|
|
31
|
+
"interactive-destructive",
|
|
32
|
+
"interactive-hover",
|
|
33
|
+
"interactive-active",
|
|
34
|
+
// bg-* tokens
|
|
35
|
+
"bg-default",
|
|
36
|
+
"bg-inverse",
|
|
37
|
+
"bg-dark",
|
|
38
|
+
"bg-light",
|
|
39
|
+
"bg-primary",
|
|
40
|
+
"bg-secondary",
|
|
41
|
+
"bg-destructive",
|
|
42
|
+
"bg-gray",
|
|
43
|
+
"bg-surface-secondary",
|
|
44
|
+
"bg-error",
|
|
45
|
+
"bg-error-subtle",
|
|
46
|
+
"bg-info",
|
|
47
|
+
"bg-info-subtle",
|
|
48
|
+
"bg-success",
|
|
49
|
+
"bg-success-subtle",
|
|
50
|
+
"bg-warning",
|
|
51
|
+
"bg-warning-subtle",
|
|
52
|
+
"bg-interactive-primary",
|
|
53
|
+
"bg-interactive-primary-hover",
|
|
54
|
+
"bg-interactive-secondary",
|
|
55
|
+
"bg-interactive-secondary-hover",
|
|
56
|
+
"bg-interactive-error",
|
|
57
|
+
"bg-interactive-error-hover",
|
|
58
|
+
"bg-interactive-error-subtle",
|
|
59
|
+
"bg-interactive-info",
|
|
60
|
+
"bg-interactive-success",
|
|
61
|
+
"bg-interactive-warning"
|
|
62
|
+
],
|
|
63
|
+
"text-color": [
|
|
64
|
+
// sidebar tokens
|
|
65
|
+
"sidebar-foreground",
|
|
66
|
+
"sidebar-item-fg",
|
|
67
|
+
// interactive foreground tokens
|
|
68
|
+
"interactive-default-fg",
|
|
69
|
+
"interactive-accent-fg",
|
|
70
|
+
"interactive-secondary-fg",
|
|
71
|
+
"interactive-destructive-fg",
|
|
72
|
+
// text-* tokens
|
|
73
|
+
"text-default",
|
|
74
|
+
"text-dark",
|
|
75
|
+
"text-light",
|
|
76
|
+
"text-interactive-error",
|
|
77
|
+
"text-interactive-info",
|
|
78
|
+
"text-interactive-success",
|
|
79
|
+
"text-interactive-warning"
|
|
80
|
+
]
|
|
81
|
+
}
|
|
82
|
+
}
|
|
83
|
+
});
|
|
9
84
|
function cn(...inputs) {
|
|
10
85
|
return twMerge(clsx(inputs));
|
|
11
86
|
}
|
|
@@ -1638,7 +1713,7 @@ var Sidebar = React14.forwardRef(
|
|
|
1638
1713
|
"aside",
|
|
1639
1714
|
{
|
|
1640
1715
|
ref,
|
|
1641
|
-
className: "group peer
|
|
1716
|
+
className: "group peer sidebar-foreground",
|
|
1642
1717
|
"data-state": state,
|
|
1643
1718
|
"data-collapsible": state === "collapsed" ? collapsible : "",
|
|
1644
1719
|
"aria-label": "Main navigation",
|
|
@@ -1659,15 +1734,17 @@ var Sidebar = React14.forwardRef(
|
|
|
1659
1734
|
{
|
|
1660
1735
|
className: cn(
|
|
1661
1736
|
"fixed inset-y-0 z-10 h-svh w-[var(--sidebar-width)] transition-[left,right,width] duration-200 ease-linear flex left-0",
|
|
1662
|
-
"group-data-[collapsible=icon]:w-[var(--sidebar-width-icon)]"
|
|
1663
|
-
className
|
|
1737
|
+
"group-data-[collapsible=icon]:w-[var(--sidebar-width-icon)]"
|
|
1664
1738
|
),
|
|
1665
|
-
...props,
|
|
1666
1739
|
children: /* @__PURE__ */ jsx17(
|
|
1667
1740
|
"div",
|
|
1668
1741
|
{
|
|
1669
1742
|
"data-sidebar": "sidebar",
|
|
1670
|
-
className:
|
|
1743
|
+
className: cn(
|
|
1744
|
+
"flex h-full w-full flex-col gap-8 p-4 px-2 sidebar-default",
|
|
1745
|
+
className
|
|
1746
|
+
),
|
|
1747
|
+
...props,
|
|
1671
1748
|
children
|
|
1672
1749
|
}
|
|
1673
1750
|
)
|
|
@@ -1686,7 +1763,7 @@ var SidebarInset = React14.forwardRef(
|
|
|
1686
1763
|
{
|
|
1687
1764
|
ref,
|
|
1688
1765
|
className: cn(
|
|
1689
|
-
"relative flex min-h-svh flex-1 flex-col bg-
|
|
1766
|
+
"relative flex min-h-svh flex-1 flex-col bg-[var(--color-bg-default)]",
|
|
1690
1767
|
className
|
|
1691
1768
|
),
|
|
1692
1769
|
...props
|
|
@@ -1802,7 +1879,7 @@ var SidebarMenuButton = React14.forwardRef(({ isActive = false, tooltip, classNa
|
|
|
1802
1879
|
"data-active": isActive,
|
|
1803
1880
|
"aria-current": isActive ? "page" : void 0,
|
|
1804
1881
|
className: cn(
|
|
1805
|
-
"peer/menu-button flex w-full h-8 items-center gap-2 overflow-hidden rounded-lg p-2 text-left outline-none transition-[width,height,padding] hover:bg-white/10 data-[active=true]:
|
|
1882
|
+
"peer/menu-button flex w-full h-8 items-center gap-2 overflow-hidden rounded-lg p-2 text-left outline-none transition-[width,height,padding] hover:bg-white/10 data-[active=true]:sidebar-item data-[active=true]:sidebar-item-fg data-[active=true]:hover:sidebar-item group-data-[collapsible=icon]:!size-8 group-data-[collapsible=icon]:!p-2 group-data-[collapsible=icon]:!gap-2 group-data-[collapsible=icon]:[&>*:not(svg)]:hidden [&>*:last-child]:truncate [&>svg]:shrink-0",
|
|
1806
1883
|
className
|
|
1807
1884
|
),
|
|
1808
1885
|
...props,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@northslopetech/altitude-ui",
|
|
3
|
-
"version": "3.0.0-alpha.
|
|
3
|
+
"version": "3.0.0-alpha.9",
|
|
4
4
|
"private": false,
|
|
5
5
|
"description": "React UI components for the Altitude design system",
|
|
6
6
|
"author": "Northslope",
|
|
@@ -70,7 +70,7 @@
|
|
|
70
70
|
"react-pdf": "^10.0.1",
|
|
71
71
|
"recharts": "^3.2.1",
|
|
72
72
|
"tailwind-merge": "^2.5.4",
|
|
73
|
-
"@northslopetech/altitude-tokens": "^3.0.0-alpha.
|
|
73
|
+
"@northslopetech/altitude-tokens": "^3.0.0-alpha.9"
|
|
74
74
|
},
|
|
75
75
|
"peerDependencies": {
|
|
76
76
|
"react": "^18.0.0 || ^19.0.0",
|