@devalok/shilp-sutra 0.30.0 → 0.31.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 +82 -239
- package/dist/_chunks/badge-group.js +34 -33
- package/dist/ai/types.js +2 -0
- package/dist/composed/content-card.d.ts.map +1 -1
- package/dist/composed/lib/string-utils.d.ts.map +1 -1
- package/dist/composed/loading-skeleton.d.ts.map +1 -1
- package/dist/composed/page-header.d.ts.map +1 -1
- package/dist/composed/page-skeletons.d.ts.map +1 -1
- package/dist/composed/priority-indicator.d.ts +1 -0
- package/dist/composed/priority-indicator.js +1 -0
- package/dist/tokens/typography.css +33 -4
- package/dist/ui/alert.d.ts +1 -0
- package/dist/ui/alert.d.ts.map +1 -1
- package/dist/ui/alert.js +42 -37
- package/dist/ui/badge.d.ts +6 -0
- package/dist/ui/badge.d.ts.map +1 -1
- package/dist/ui/card.d.ts +5 -1
- package/dist/ui/card.d.ts.map +1 -1
- package/dist/ui/card.js +111 -79
- package/dist/ui/code.d.ts.map +1 -1
- package/dist/ui/container.d.ts.map +1 -1
- package/dist/ui/lib/date-utils.d.ts.map +1 -1
- package/dist/ui/lib/motion.d.ts.map +1 -1
- package/dist/ui/lib/utils.d.ts.map +1 -1
- package/dist/ui/select.d.ts +3 -1
- package/dist/ui/select.d.ts.map +1 -1
- package/dist/ui/select.js +83 -71
- package/dist/ui/skeleton.d.ts.map +1 -1
- package/dist/ui/stack.d.ts.map +1 -1
- package/dist/ui/table.d.ts.map +1 -1
- package/dist/ui/tabs.d.ts +7 -0
- package/dist/ui/tabs.d.ts.map +1 -1
- package/dist/ui/tabs.js +103 -77
- package/dist/ui/text.d.ts.map +1 -1
- package/dist/ui/visually-hidden.d.ts.map +1 -1
- package/docs/components/ui/alert.md +3 -0
- package/docs/components/ui/badge.md +3 -0
- package/docs/components/ui/card.md +4 -0
- package/docs/components/ui/select.md +4 -0
- package/docs/components/ui/tabs.md +4 -0
- package/llms-full.txt +19 -1
- package/llms.txt +14 -1
- package/package.json +37 -2
package/dist/ui/select.js
CHANGED
|
@@ -1,17 +1,28 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsxs as c, jsx as e } from "react/jsx-runtime";
|
|
3
3
|
import * as o from "react";
|
|
4
|
-
import { ap as n, aq as
|
|
5
|
-
import { IconChevronDown as
|
|
6
|
-
import { a as
|
|
7
|
-
import { cn as
|
|
8
|
-
import { tweens as
|
|
4
|
+
import { ap as n, aq as N, ar as m, as as p, at as S, au as f, av as I, aw as u, ax as b, ay as R, az as z, aA as g, aB as C, aC as j, aD as B } from "../_chunks/primitives.js";
|
|
5
|
+
import { IconChevronDown as h, IconChevronUp as V, IconCheck as D } from "@tabler/icons-react";
|
|
6
|
+
import { a as T } from "../_chunks/vendor-utils.js";
|
|
7
|
+
import { cn as t } from "./lib/utils.js";
|
|
8
|
+
import { tweens as U, springs as G } from "./lib/motion.js";
|
|
9
9
|
import { Icon as i } from "./icon.js";
|
|
10
|
-
import { m as
|
|
11
|
-
const
|
|
12
|
-
"flex w-full items-center justify-between whitespace-nowrap rounded-ds-md
|
|
10
|
+
import { m as L } from "../_chunks/framer.js";
|
|
11
|
+
const X = C, Y = B, Z = j, k = T(
|
|
12
|
+
"flex w-full items-center justify-between whitespace-nowrap rounded-ds-md placeholder:text-surface-fg-subtle focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-action-disabled [&>span]:line-clamp-1",
|
|
13
13
|
{
|
|
14
14
|
variants: {
|
|
15
|
+
variant: {
|
|
16
|
+
default: "border border-surface-border-strong bg-surface-raised-hover focus-visible:border-accent-7",
|
|
17
|
+
outline: "border border-surface-border-strong bg-transparent focus-visible:border-accent-7",
|
|
18
|
+
ghost: "border border-transparent bg-transparent hover:bg-surface-raised-hover focus-visible:border-accent-7"
|
|
19
|
+
},
|
|
20
|
+
color: {
|
|
21
|
+
default: "",
|
|
22
|
+
error: "border-error-7 text-error-11 focus-visible:ring-error-9",
|
|
23
|
+
success: "border-success-7",
|
|
24
|
+
warning: "border-warning-7"
|
|
25
|
+
},
|
|
15
26
|
size: {
|
|
16
27
|
xs: "h-ds-xs-plus text-ds-sm px-ds-02",
|
|
17
28
|
sm: "h-ds-sm text-ds-sm px-ds-03",
|
|
@@ -19,128 +30,129 @@ const Q = R, W = C, X = z, G = V(
|
|
|
19
30
|
lg: "h-ds-lg text-ds-md px-ds-05"
|
|
20
31
|
}
|
|
21
32
|
},
|
|
22
|
-
defaultVariants: { size: "md" }
|
|
33
|
+
defaultVariants: { variant: "default", color: "default", size: "md" }
|
|
23
34
|
}
|
|
24
|
-
),
|
|
35
|
+
), q = o.forwardRef(({ className: s, children: r, variant: a, color: d, size: l, ...v }, w) => /* @__PURE__ */ c(
|
|
25
36
|
n,
|
|
26
37
|
{
|
|
27
|
-
ref:
|
|
28
|
-
className:
|
|
29
|
-
|
|
38
|
+
ref: w,
|
|
39
|
+
className: t(k({ variant: a, color: d, size: l }), s),
|
|
40
|
+
"aria-invalid": d === "error" || void 0,
|
|
41
|
+
...v,
|
|
30
42
|
children: [
|
|
31
|
-
|
|
32
|
-
/* @__PURE__ */ e(
|
|
43
|
+
r,
|
|
44
|
+
/* @__PURE__ */ e(N, { asChild: !0, children: /* @__PURE__ */ e(i, { icon: h, size: "sm", className: "opacity-50" }) })
|
|
33
45
|
]
|
|
34
46
|
}
|
|
35
47
|
));
|
|
36
|
-
|
|
37
|
-
const x = o.forwardRef(({ className:
|
|
48
|
+
q.displayName = n.displayName;
|
|
49
|
+
const x = o.forwardRef(({ className: s, ...r }, a) => /* @__PURE__ */ e(
|
|
38
50
|
m,
|
|
39
51
|
{
|
|
40
|
-
ref:
|
|
41
|
-
className:
|
|
52
|
+
ref: a,
|
|
53
|
+
className: t(
|
|
42
54
|
"flex cursor-default items-center justify-center py-ds-02",
|
|
43
|
-
|
|
55
|
+
s
|
|
44
56
|
),
|
|
45
|
-
...
|
|
46
|
-
children: /* @__PURE__ */ e(i, { icon:
|
|
57
|
+
...r,
|
|
58
|
+
children: /* @__PURE__ */ e(i, { icon: V, size: "sm" })
|
|
47
59
|
}
|
|
48
60
|
));
|
|
49
61
|
x.displayName = m.displayName;
|
|
50
|
-
const
|
|
62
|
+
const y = o.forwardRef(({ className: s, ...r }, a) => /* @__PURE__ */ e(
|
|
51
63
|
p,
|
|
52
64
|
{
|
|
53
|
-
ref:
|
|
54
|
-
className:
|
|
65
|
+
ref: a,
|
|
66
|
+
className: t(
|
|
55
67
|
"flex cursor-default items-center justify-center py-ds-02",
|
|
56
|
-
|
|
68
|
+
s
|
|
57
69
|
),
|
|
58
|
-
...
|
|
59
|
-
children: /* @__PURE__ */ e(i, { icon:
|
|
70
|
+
...r,
|
|
71
|
+
children: /* @__PURE__ */ e(i, { icon: h, size: "sm" })
|
|
60
72
|
}
|
|
61
73
|
));
|
|
62
|
-
|
|
63
|
-
const
|
|
74
|
+
y.displayName = p.displayName;
|
|
75
|
+
const A = o.forwardRef(({ className: s, children: r, position: a = "popper", ...d }, l) => /* @__PURE__ */ e(S, { children: /* @__PURE__ */ e(
|
|
64
76
|
f,
|
|
65
77
|
{
|
|
66
78
|
ref: l,
|
|
67
|
-
position:
|
|
79
|
+
position: a,
|
|
68
80
|
asChild: !0,
|
|
69
81
|
...d,
|
|
70
82
|
children: /* @__PURE__ */ c(
|
|
71
|
-
|
|
83
|
+
L.div,
|
|
72
84
|
{
|
|
73
85
|
initial: { opacity: 0, scale: 0.95 },
|
|
74
86
|
animate: { opacity: 1, scale: 1 },
|
|
75
|
-
transition: { ...
|
|
76
|
-
className:
|
|
87
|
+
transition: { ...G.snappy, opacity: U.fade },
|
|
88
|
+
className: t(
|
|
77
89
|
"relative z-popover max-h-96 min-w-[8rem] overflow-hidden rounded-ds-lg border border-surface-border-strong bg-surface-overlay text-surface-fg shadow-floating",
|
|
78
|
-
|
|
79
|
-
|
|
90
|
+
a === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
|
|
91
|
+
s
|
|
80
92
|
),
|
|
81
93
|
children: [
|
|
82
94
|
/* @__PURE__ */ e(x, {}),
|
|
83
95
|
/* @__PURE__ */ e(
|
|
84
|
-
|
|
96
|
+
I,
|
|
85
97
|
{
|
|
86
|
-
className:
|
|
98
|
+
className: t(
|
|
87
99
|
"p-ds-02",
|
|
88
|
-
|
|
100
|
+
a === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
|
|
89
101
|
),
|
|
90
|
-
children:
|
|
102
|
+
children: r
|
|
91
103
|
}
|
|
92
104
|
),
|
|
93
|
-
/* @__PURE__ */ e(
|
|
105
|
+
/* @__PURE__ */ e(y, {})
|
|
94
106
|
]
|
|
95
107
|
}
|
|
96
108
|
)
|
|
97
109
|
}
|
|
98
110
|
) }));
|
|
99
|
-
|
|
100
|
-
const
|
|
111
|
+
A.displayName = f.displayName;
|
|
112
|
+
const P = o.forwardRef(({ className: s, ...r }, a) => /* @__PURE__ */ e(
|
|
101
113
|
u,
|
|
102
114
|
{
|
|
103
|
-
ref:
|
|
104
|
-
className:
|
|
105
|
-
...
|
|
115
|
+
ref: a,
|
|
116
|
+
className: t("px-ds-03 py-ds-02b text-ds-md font-semibold", s),
|
|
117
|
+
...r
|
|
106
118
|
}
|
|
107
119
|
));
|
|
108
|
-
|
|
109
|
-
const
|
|
110
|
-
|
|
120
|
+
P.displayName = u.displayName;
|
|
121
|
+
const $ = o.forwardRef(({ className: s, children: r, ...a }, d) => /* @__PURE__ */ c(
|
|
122
|
+
b,
|
|
111
123
|
{
|
|
112
124
|
ref: d,
|
|
113
|
-
className:
|
|
125
|
+
className: t(
|
|
114
126
|
"relative flex w-full cursor-default select-none items-center rounded-ds-md py-ds-02b pl-ds-03 pr-ds-07 text-ds-md outline-none transition-colors duration-fast-01 ease-productive-standard hover:bg-surface-raised focus:bg-surface-raised focus:text-surface-fg data-[disabled]:pointer-events-none data-[disabled]:opacity-action-disabled",
|
|
115
|
-
|
|
127
|
+
s
|
|
116
128
|
),
|
|
117
|
-
...
|
|
129
|
+
...a,
|
|
118
130
|
children: [
|
|
119
|
-
/* @__PURE__ */ e("span", { className: "absolute right-ds-03 flex h-ico-sm w-ico-sm items-center justify-center", children: /* @__PURE__ */ e(
|
|
120
|
-
/* @__PURE__ */ e(
|
|
131
|
+
/* @__PURE__ */ e("span", { className: "absolute right-ds-03 flex h-ico-sm w-ico-sm items-center justify-center", children: /* @__PURE__ */ e(R, { children: /* @__PURE__ */ e(i, { icon: D, size: "sm" }) }) }),
|
|
132
|
+
/* @__PURE__ */ e(z, { children: r })
|
|
121
133
|
]
|
|
122
134
|
}
|
|
123
135
|
));
|
|
124
|
-
|
|
125
|
-
const
|
|
126
|
-
|
|
136
|
+
$.displayName = b.displayName;
|
|
137
|
+
const E = o.forwardRef(({ className: s, ...r }, a) => /* @__PURE__ */ e(
|
|
138
|
+
g,
|
|
127
139
|
{
|
|
128
|
-
ref:
|
|
129
|
-
className:
|
|
130
|
-
...
|
|
140
|
+
ref: a,
|
|
141
|
+
className: t("-mx-ds-01 my-ds-02 h-px bg-surface-border", s),
|
|
142
|
+
...r
|
|
131
143
|
}
|
|
132
144
|
));
|
|
133
|
-
|
|
145
|
+
E.displayName = g.displayName;
|
|
134
146
|
export {
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
147
|
+
X as Select,
|
|
148
|
+
A as SelectContent,
|
|
149
|
+
Y as SelectGroup,
|
|
150
|
+
$ as SelectItem,
|
|
151
|
+
P as SelectLabel,
|
|
152
|
+
y as SelectScrollDownButton,
|
|
141
153
|
x as SelectScrollUpButton,
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
154
|
+
E as SelectSeparator,
|
|
155
|
+
q as SelectTrigger,
|
|
156
|
+
Z as SelectValue,
|
|
157
|
+
k as selectTriggerVariants
|
|
146
158
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"skeleton.d.ts","sourceRoot":"","sources":["../../src/ui/skeleton.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"skeleton.d.ts","sourceRoot":"","sources":["../../src/ui/skeleton.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAGjE,QAAA,MAAM,gBAAgB;;;8EAkBpB,CAAA;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,MAAM,WAAW,aACf,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAC1C,YAAY,CAAC,OAAO,gBAAgB,CAAC;CAAG;AAE5C,QAAA,MAAM,QAAQ,sFAWb,CAAA;AAcD,KAAK,iBAAiB,GAAG,OAAO,GAAG,SAAS,GAAG,MAAM,CAAA;AAarD,MAAM,WAAW,mBAAoB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC/E,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;IAChC,SAAS,CAAC,EAAE,iBAAiB,CAAA;CAC9B;AAED,QAAA,MAAM,cAAc,4FAenB,CAAA;AAkBD,MAAM,WAAW,iBAAkB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC7E,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,qFAAqF;IACrF,aAAa,CAAC,EAAE,MAAM,GAAG,eAAe,GAAG,MAAM,CAAA;IACjD,wBAAwB;IACxB,OAAO,CAAC,EAAE,IAAI,GAAG,IAAI,CAAA;IACrB,SAAS,CAAC,EAAE,iBAAiB,CAAA;CAC9B;AAED,QAAA,MAAM,YAAY,0FAgCjB,CAAA;AAkBD,MAAM,WAAW,mBAAoB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC/E,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;IACzB,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,MAAM,CAAA;IAChC,SAAS,CAAC,EAAE,iBAAiB,CAAA;CAC9B;AAED,QAAA,MAAM,cAAc,4FAiBnB,CAAA;AAaD,MAAM,WAAW,kBAAmB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC9E,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;IACzB,SAAS,CAAC,EAAE,iBAAiB,CAAA;CAC9B;AAED,QAAA,MAAM,aAAa,2FAelB,CAAA;AAUD,MAAM,WAAW,kBAAmB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC9E,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,SAAS,CAAC,EAAE,iBAAiB,CAAA;CAC9B;AAED,QAAA,MAAM,aAAa,2FAyBlB,CAAA;AAOD,MAAM,WAAW,kBAAmB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC9E,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,SAAS,CAAC,EAAE,iBAAiB,CAAA;CAC9B;AAED,QAAA,MAAM,aAAa,2FAkClB,CAAA;AAOD,MAAM,WAAW,kBAAmB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC9E,6CAA6C;IAC7C,KAAK,CAAC,EAAE,MAAM,CAAA;CACf;AAED,QAAA,MAAM,aAAa,2FASlB,CAAA;AAGD,OAAO,EACL,QAAQ,EACR,gBAAgB,EAChB,cAAc,EACd,YAAY,EACZ,cAAc,EACd,aAAa,EACb,aAAa,EACb,aAAa,EACb,aAAa,GACd,CAAA"}
|
package/dist/ui/stack.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"stack.d.ts","sourceRoot":"","sources":["../../src/ui/stack.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"stack.d.ts","sourceRoot":"","sources":["../../src/ui/stack.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,KAAK,YAAY,GACb,OAAO,GACP,OAAO,GACP,QAAQ,GACR,OAAO,GACP,OAAO,GACP,OAAO,GACP,QAAQ,GACR,OAAO,GACP,OAAO,GACP,OAAO,GACP,OAAO,GACP,OAAO,GACP,OAAO,GACP,OAAO,GACP,OAAO,CAAA;AAEX,KAAK,UAAU,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,KAAK,IAAI;IACrD,EAAE,CAAC,EAAE,CAAC,CAAA;IACN,SAAS,CAAC,EAAE,UAAU,GAAG,YAAY,GAAG,KAAK,GAAG,QAAQ,CAAA;IACxD,GAAG,CAAC,EAAE,YAAY,GAAG,MAAM,CAAA;IAC3B,KAAK,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,SAAS,GAAG,UAAU,CAAA;IAC3D,OAAO,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,SAAS,GAAG,QAAQ,GAAG,QAAQ,CAAA;IACtE,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC3B,GAAG,IAAI,CAAC,KAAK,CAAC,qBAAqB,CAAC,CAAC,CAAC,EAAE,IAAI,GAAG,WAAW,GAAG,UAAU,CAAC,CAAA;AAmDzE,QAAA,MAAM,KAAK,oGAqBV,CAAA;AAGD,OAAO,EAAE,KAAK,EAAE,KAAK,YAAY,EAAE,KAAK,UAAU,EAAE,CAAA"}
|
package/dist/ui/table.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"table.d.ts","sourceRoot":"","sources":["../../src/ui/table.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"table.d.ts","sourceRoot":"","sources":["../../src/ui/table.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B,QAAA,MAAM,KAAK,iHAWT,CAAA;AAGF,QAAA,MAAM,WAAW,+HAKf,CAAA;AAGF,QAAA,MAAM,SAAS,+HASb,CAAA;AAGF,QAAA,MAAM,WAAW,+HAYf,CAAA;AAGF,QAAA,MAAM,QAAQ,uHAYZ,CAAA;AAGF,QAAA,MAAM,SAAS,2HAab,CAAA;AAGF,QAAA,MAAM,SAAS,2HAYb,CAAA;AAGF,QAAA,MAAM,YAAY,+HAShB,CAAA;AAGF,MAAM,MAAM,UAAU,GAAG,KAAK,CAAC,cAAc,CAAC,gBAAgB,CAAC,CAAA;AAC/D,MAAM,MAAM,aAAa,GAAG,KAAK,CAAC,cAAc,CAAC,mBAAmB,CAAC,CAAA;AACrE,MAAM,MAAM,cAAc,GAAG,KAAK,CAAC,gBAAgB,CAAC,oBAAoB,CAAC,CAAA;AAEzE,OAAO,EACL,KAAK,EACL,WAAW,EACX,SAAS,EACT,WAAW,EACX,SAAS,EACT,QAAQ,EACR,SAAS,EACT,YAAY,GACb,CAAA"}
|
package/dist/ui/tabs.d.ts
CHANGED
|
@@ -48,11 +48,15 @@ import * as React from 'react';
|
|
|
48
48
|
declare const Tabs: React.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
49
49
|
/** Props for the Tabs root (defaultValue, value, onValueChange, etc.). */
|
|
50
50
|
export type TabsProps = React.ComponentPropsWithoutRef<typeof TabsPrimitive.Root>;
|
|
51
|
+
type TabsSize = 'sm' | 'md' | 'lg';
|
|
52
|
+
type TabsColor = 'accent' | 'neutral';
|
|
51
53
|
declare const tabsListVariants: (props?: ({
|
|
52
54
|
variant?: "line" | "contained" | null | undefined;
|
|
55
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
53
56
|
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
54
57
|
declare const tabsTriggerVariants: (props?: ({
|
|
55
58
|
variant?: "line" | "contained" | null | undefined;
|
|
59
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
56
60
|
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
57
61
|
/**
|
|
58
62
|
* TabsList — container for tab triggers. Sets `variant` for all child TabsTriggers via context.
|
|
@@ -73,6 +77,8 @@ declare const tabsTriggerVariants: (props?: ({
|
|
|
73
77
|
* You do NOT need to repeat `variant` on each `TabsTrigger`.
|
|
74
78
|
*/
|
|
75
79
|
export interface TabsListProps extends React.ComponentPropsWithoutRef<typeof TabsPrimitive.List>, VariantProps<typeof tabsListVariants> {
|
|
80
|
+
/** Color axis — affects active tab indicator and text color. @default "accent" */
|
|
81
|
+
color?: TabsColor;
|
|
76
82
|
}
|
|
77
83
|
declare const TabsList: React.ForwardRefExoticComponent<TabsListProps & React.RefAttributes<HTMLDivElement>>;
|
|
78
84
|
export interface TabsTriggerProps extends React.ComponentPropsWithoutRef<typeof TabsPrimitive.Trigger>, VariantProps<typeof tabsTriggerVariants> {
|
|
@@ -82,4 +88,5 @@ declare const TabsContent: React.ForwardRefExoticComponent<Omit<TabsPrimitive.Ta
|
|
|
82
88
|
/** Props for TabsContent. The `value` prop must match a TabsTrigger's `value`. */
|
|
83
89
|
export type TabsContentProps = React.ComponentPropsWithoutRef<typeof TabsPrimitive.Content>;
|
|
84
90
|
export { Tabs, TabsList, TabsTrigger, TabsContent };
|
|
91
|
+
export type { TabsSize, TabsColor };
|
|
85
92
|
//# sourceMappingURL=tabs.d.ts.map
|
package/dist/ui/tabs.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["../../src/ui/tabs.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,aAAa,MAAM,wBAAwB,CAAA;AACvD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAQjE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0CG;AACH,QAAA,MAAM,IAAI,mJAgCR,CAAA;AAGF,0EAA0E;AAC1E,MAAM,MAAM,SAAS,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,aAAa,CAAC,IAAI,CAAC,CAAA;
|
|
1
|
+
{"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["../../src/ui/tabs.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,aAAa,MAAM,wBAAwB,CAAA;AACvD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAQjE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0CG;AACH,QAAA,MAAM,IAAI,mJAgCR,CAAA;AAGF,0EAA0E;AAC1E,MAAM,MAAM,SAAS,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,aAAa,CAAC,IAAI,CAAC,CAAA;AAGjF,KAAK,QAAQ,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;AAClC,KAAK,SAAS,GAAG,QAAQ,GAAG,SAAS,CAAA;AAgBrC,QAAA,MAAM,gBAAgB;;;8EAcpB,CAAA;AAEF,QAAA,MAAM,mBAAmB;;;8EAuBxB,CAAA;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,MAAM,WAAW,aACf,SAAQ,KAAK,CAAC,wBAAwB,CAAC,OAAO,aAAa,CAAC,IAAI,CAAC,EAC/D,YAAY,CAAC,OAAO,gBAAgB,CAAC;IACvC,kFAAkF;IAClF,KAAK,CAAC,EAAE,SAAS,CAAA;CAClB;AAED,QAAA,MAAM,QAAQ,sFA4BZ,CAAA;AAGF,MAAM,WAAW,gBACf,SAAQ,KAAK,CAAC,wBAAwB,CAAC,OAAO,aAAa,CAAC,OAAO,CAAC,EAClE,YAAY,CAAC,OAAO,mBAAmB,CAAC;CAAG;AAa/C,QAAA,MAAM,WAAW,4FAyCf,CAAA;AAGF,QAAA,MAAM,WAAW,0JAoBf,CAAA;AAGF,kFAAkF;AAClF,MAAM,MAAM,gBAAgB,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,aAAa,CAAC,OAAO,CAAC,CAAA;AAE3F,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,WAAW,EAAE,WAAW,EAAE,CAAA;AACnD,YAAY,EAAE,QAAQ,EAAE,SAAS,EAAE,CAAA"}
|
package/dist/ui/tabs.js
CHANGED
|
@@ -1,134 +1,160 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import { jsx as
|
|
3
|
-
import { aS as
|
|
4
|
-
import * as
|
|
5
|
-
import { a as
|
|
6
|
-
import { cn as
|
|
7
|
-
import { springs as
|
|
8
|
-
import { L as
|
|
9
|
-
const
|
|
10
|
-
const [
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
}, [
|
|
14
|
-
const
|
|
15
|
-
(
|
|
16
|
-
c(
|
|
2
|
+
import { jsx as s, jsxs as N } from "react/jsx-runtime";
|
|
3
|
+
import { aS as z, aT as g, aU as p, aV as x } from "../_chunks/primitives.js";
|
|
4
|
+
import * as e from "react";
|
|
5
|
+
import { a as y } from "../_chunks/vendor-utils.js";
|
|
6
|
+
import { cn as m } from "./lib/utils.js";
|
|
7
|
+
import { springs as b, tweens as T } from "./lib/motion.js";
|
|
8
|
+
import { L as V, m as v } from "../_chunks/framer.js";
|
|
9
|
+
const h = e.createContext(void 0), I = e.forwardRef(({ value: t, defaultValue: n, onValueChange: o, ...r }, l) => {
|
|
10
|
+
const [i, c] = e.useState(t ?? n ?? "");
|
|
11
|
+
e.useEffect(() => {
|
|
12
|
+
t !== void 0 && c(t);
|
|
13
|
+
}, [t]);
|
|
14
|
+
const a = e.useCallback(
|
|
15
|
+
(d) => {
|
|
16
|
+
c(d), o?.(d);
|
|
17
17
|
},
|
|
18
|
-
[
|
|
18
|
+
[o]
|
|
19
19
|
);
|
|
20
|
-
return /* @__PURE__ */
|
|
21
|
-
|
|
20
|
+
return /* @__PURE__ */ s(h.Provider, { value: i, children: /* @__PURE__ */ s(
|
|
21
|
+
z,
|
|
22
22
|
{
|
|
23
|
-
ref:
|
|
24
|
-
value:
|
|
25
|
-
defaultValue:
|
|
26
|
-
onValueChange:
|
|
27
|
-
...
|
|
23
|
+
ref: l,
|
|
24
|
+
value: t,
|
|
25
|
+
defaultValue: t === void 0 ? n : void 0,
|
|
26
|
+
onValueChange: a,
|
|
27
|
+
...r
|
|
28
28
|
}
|
|
29
29
|
) });
|
|
30
30
|
});
|
|
31
|
-
|
|
32
|
-
const
|
|
31
|
+
I.displayName = "Tabs";
|
|
32
|
+
const C = e.createContext({
|
|
33
33
|
variant: "line",
|
|
34
|
+
size: "md",
|
|
35
|
+
color: "accent",
|
|
34
36
|
layoutId: "tab-indicator"
|
|
35
|
-
}), w =
|
|
37
|
+
}), w = y("inline-flex items-center", {
|
|
36
38
|
variants: {
|
|
37
39
|
variant: {
|
|
38
40
|
line: "border-b border-surface-border-strong w-full gap-0",
|
|
39
41
|
contained: "bg-surface-raised p-ds-02 rounded-ds-lg gap-ds-02"
|
|
42
|
+
},
|
|
43
|
+
size: {
|
|
44
|
+
sm: "h-8",
|
|
45
|
+
md: "h-10",
|
|
46
|
+
lg: "h-12"
|
|
40
47
|
}
|
|
41
48
|
},
|
|
42
|
-
defaultVariants: { variant: "line" }
|
|
43
|
-
}),
|
|
44
|
-
"relative inline-flex items-center justify-center gap-ds-02 whitespace-nowrap font-sans
|
|
49
|
+
defaultVariants: { variant: "line", size: "md" }
|
|
50
|
+
}), L = y(
|
|
51
|
+
"relative inline-flex items-center justify-center gap-ds-02 whitespace-nowrap font-sans font-medium transition-colors duration-100 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-1 disabled:pointer-events-none disabled:opacity-action-disabled",
|
|
45
52
|
{
|
|
46
53
|
variants: {
|
|
47
54
|
variant: {
|
|
48
55
|
line: [
|
|
49
|
-
"
|
|
50
|
-
"text-surface-fg-muted hover:text-surface-fg"
|
|
51
|
-
"data-[state=active]:text-accent-11"
|
|
56
|
+
"-mb-px",
|
|
57
|
+
"text-surface-fg-muted hover:text-surface-fg"
|
|
52
58
|
],
|
|
53
59
|
contained: [
|
|
54
|
-
"
|
|
60
|
+
"rounded-ds-md",
|
|
55
61
|
"text-surface-fg-muted hover:text-surface-fg",
|
|
56
62
|
"data-[state=active]:text-surface-fg"
|
|
57
63
|
]
|
|
64
|
+
},
|
|
65
|
+
size: {
|
|
66
|
+
sm: "px-ds-03 py-ds-02 text-ds-xs",
|
|
67
|
+
md: "px-ds-05 py-ds-03 text-ds-sm",
|
|
68
|
+
lg: "px-ds-06 py-ds-04 text-ds-md"
|
|
58
69
|
}
|
|
59
70
|
},
|
|
60
|
-
defaultVariants: { variant: "line" }
|
|
71
|
+
defaultVariants: { variant: "line", size: "md" }
|
|
61
72
|
}
|
|
62
|
-
),
|
|
63
|
-
const
|
|
64
|
-
() => ({
|
|
65
|
-
|
|
73
|
+
), R = e.forwardRef(({ className: t, variant: n, size: o, color: r, ...l }, i) => {
|
|
74
|
+
const c = n ?? "line", a = o ?? "md", d = r ?? "accent", f = e.useId(), u = e.useMemo(
|
|
75
|
+
() => ({
|
|
76
|
+
variant: c,
|
|
77
|
+
size: a,
|
|
78
|
+
color: d,
|
|
79
|
+
layoutId: `tab-indicator-${f}`
|
|
80
|
+
}),
|
|
81
|
+
[c, a, d, f]
|
|
66
82
|
);
|
|
67
|
-
return /* @__PURE__ */
|
|
68
|
-
|
|
83
|
+
return /* @__PURE__ */ s(C.Provider, { value: u, children: /* @__PURE__ */ s(V, { children: /* @__PURE__ */ s(
|
|
84
|
+
g,
|
|
69
85
|
{
|
|
70
|
-
ref:
|
|
71
|
-
className:
|
|
72
|
-
...
|
|
86
|
+
ref: i,
|
|
87
|
+
className: m(w({ variant: c, size: a }), t),
|
|
88
|
+
...l
|
|
73
89
|
}
|
|
74
90
|
) }) });
|
|
75
91
|
});
|
|
76
|
-
|
|
77
|
-
const
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
92
|
+
R.displayName = g.displayName;
|
|
93
|
+
const j = {
|
|
94
|
+
accent: "data-[state=active]:text-accent-11",
|
|
95
|
+
neutral: "data-[state=active]:text-surface-fg"
|
|
96
|
+
}, A = {
|
|
97
|
+
accent: "bg-accent-9",
|
|
98
|
+
neutral: "bg-surface-fg"
|
|
99
|
+
}, M = e.forwardRef(({ className: t, variant: n, children: o, ...r }, l) => {
|
|
100
|
+
const i = e.useContext(C), c = e.useContext(h), a = n ?? i.variant, d = i.size, f = i.color, u = r.value === c;
|
|
101
|
+
return /* @__PURE__ */ N(
|
|
102
|
+
p,
|
|
81
103
|
{
|
|
82
|
-
ref:
|
|
83
|
-
className:
|
|
84
|
-
|
|
104
|
+
ref: l,
|
|
105
|
+
className: m(
|
|
106
|
+
L({ variant: a, size: d }),
|
|
107
|
+
a === "line" && j[f],
|
|
108
|
+
t
|
|
109
|
+
),
|
|
110
|
+
...r,
|
|
85
111
|
children: [
|
|
86
|
-
|
|
87
|
-
|
|
112
|
+
a === "contained" && u && /* @__PURE__ */ s(
|
|
113
|
+
v.span,
|
|
88
114
|
{
|
|
89
|
-
layoutId: `${
|
|
115
|
+
layoutId: `${i.layoutId}-contained`,
|
|
90
116
|
className: "absolute inset-0 rounded-ds-md bg-surface-overlay shadow-raised",
|
|
91
|
-
transition:
|
|
117
|
+
transition: b.smooth
|
|
92
118
|
}
|
|
93
119
|
),
|
|
94
|
-
/* @__PURE__ */
|
|
95
|
-
|
|
96
|
-
|
|
120
|
+
/* @__PURE__ */ s("span", { className: "relative z-[1] inline-flex items-center gap-ds-02", children: o }),
|
|
121
|
+
a === "line" && u && /* @__PURE__ */ s(
|
|
122
|
+
v.span,
|
|
97
123
|
{
|
|
98
|
-
layoutId: `${
|
|
99
|
-
className: "absolute bottom-0 left-0 right-0 h-0.5
|
|
100
|
-
transition:
|
|
124
|
+
layoutId: `${i.layoutId}-line`,
|
|
125
|
+
className: m("absolute bottom-0 left-0 right-0 h-0.5", A[f]),
|
|
126
|
+
transition: b.smooth
|
|
101
127
|
}
|
|
102
128
|
)
|
|
103
129
|
]
|
|
104
130
|
}
|
|
105
131
|
);
|
|
106
132
|
});
|
|
107
|
-
|
|
108
|
-
const
|
|
109
|
-
|
|
133
|
+
M.displayName = p.displayName;
|
|
134
|
+
const S = e.forwardRef(({ className: t, children: n, ...o }, r) => /* @__PURE__ */ s(
|
|
135
|
+
x,
|
|
110
136
|
{
|
|
111
|
-
ref:
|
|
112
|
-
className:
|
|
137
|
+
ref: r,
|
|
138
|
+
className: m(
|
|
113
139
|
"mt-ds-05 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent-9 focus-visible:ring-offset-2",
|
|
114
|
-
|
|
140
|
+
t
|
|
115
141
|
),
|
|
116
|
-
...
|
|
117
|
-
children: /* @__PURE__ */
|
|
118
|
-
|
|
142
|
+
...o,
|
|
143
|
+
children: /* @__PURE__ */ s(
|
|
144
|
+
v.div,
|
|
119
145
|
{
|
|
120
146
|
initial: { opacity: 0 },
|
|
121
147
|
animate: { opacity: 1 },
|
|
122
|
-
transition:
|
|
123
|
-
children:
|
|
148
|
+
transition: T.fade,
|
|
149
|
+
children: n
|
|
124
150
|
}
|
|
125
151
|
)
|
|
126
152
|
}
|
|
127
153
|
));
|
|
128
|
-
|
|
154
|
+
S.displayName = x.displayName;
|
|
129
155
|
export {
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
156
|
+
I as Tabs,
|
|
157
|
+
S as TabsContent,
|
|
158
|
+
R as TabsList,
|
|
159
|
+
M as TabsTrigger
|
|
134
160
|
};
|
package/dist/ui/text.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"text.d.ts","sourceRoot":"","sources":["../../src/ui/text.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"text.d.ts","sourceRoot":"","sources":["../../src/ui/text.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAGjE,QAAA,MAAM,YAAY;;8EAwBhB,CAAA;AAEF,KAAK,WAAW,GAAG,WAAW,CAAC,YAAY,CAAC,OAAO,YAAY,CAAC,CAAC,SAAS,CAAC,CAAC,CAAA;AAqB5E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AACH,KAAK,SAAS,CAAC,CAAC,SAAS,KAAK,CAAC,WAAW,GAAG,GAAG,IAAI;IAClD,OAAO,CAAC,EAAE,WAAW,CAAA;IACrB,EAAE,CAAC,EAAE,KAAK,CAAC,WAAW,CAAA;IACtB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC3B,GAAG,IAAI,CAAC,KAAK,CAAC,qBAAqB,CAAC,CAAC,CAAC,EAAE,IAAI,GAAG,SAAS,GAAG,WAAW,GAAG,UAAU,CAAC,CAAA;AAErF,QAAA,MAAM,IAAI,iGAST,CAAA;AAGD,OAAO,EAAE,IAAI,EAAE,YAAY,EAAE,KAAK,SAAS,EAAE,KAAK,WAAW,EAAE,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"visually-hidden.d.ts","sourceRoot":"","sources":["../../src/ui/visually-hidden.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"visually-hidden.d.ts","sourceRoot":"","sources":["../../src/ui/visually-hidden.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,MAAM,WAAW,mBACf,SAAQ,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC;CAAG;AAElD,QAAA,MAAM,cAAc,6FAInB,CAAA;AAGD,OAAO,EAAE,cAAc,EAAE,CAAA"}
|
|
@@ -28,6 +28,9 @@
|
|
|
28
28
|
- Icon is auto-selected by color (info=circle, success=check, warning=triangle, error=alert)
|
|
29
29
|
|
|
30
30
|
## Changes
|
|
31
|
+
### v0.31.0
|
|
32
|
+
- **Added** `size` prop: `sm | md | lg`. Default `md` (non-breaking).
|
|
33
|
+
|
|
31
34
|
### v0.18.0
|
|
32
35
|
- **Changed** Exit animation migrated to Framer Motion
|
|
33
36
|
- **Fixed** `onDismiss` JSDoc documenting it fires after exit animation completes
|
|
@@ -43,6 +43,9 @@
|
|
|
43
43
|
- `color="custom"` requires `--badge-color` CSS variable (and optionally `--badge-fg-color` for solid variant)
|
|
44
44
|
|
|
45
45
|
## Changes
|
|
46
|
+
### v0.31.0
|
|
47
|
+
- **Added** `truncate` prop — enables ellipsis truncation without requiring maxWidth
|
|
48
|
+
|
|
46
49
|
### v0.29.0
|
|
47
50
|
- **Changed** (BREAKING) v2 rewrite — Badge is now a full interactive component
|
|
48
51
|
- **Added** `soft` variant (tinted bg, no border — completes the 4-variant set: subtle/solid/outline/soft)
|
|
@@ -34,6 +34,10 @@
|
|
|
34
34
|
- Use `interactive` prop for clickable cards — adds hover lift and pointer cursor
|
|
35
35
|
|
|
36
36
|
## Changes
|
|
37
|
+
### v0.31.0
|
|
38
|
+
- **Added** `color` prop: semantic border color (accent, error, success, warning, info, neutral)
|
|
39
|
+
- **Added** `size` prop: `sm | md | lg` — padding propagated to sub-components via React context
|
|
40
|
+
|
|
37
41
|
### v0.18.0
|
|
38
42
|
- **Changed** Interactive card hover lift animation migrated to Framer Motion
|
|
39
43
|
|
|
@@ -39,6 +39,10 @@
|
|
|
39
39
|
- `<Select size="lg">` is silently ignored (no TypeScript error)
|
|
40
40
|
|
|
41
41
|
## Changes
|
|
42
|
+
### v0.31.0
|
|
43
|
+
- **Added** `variant` prop on SelectTrigger: `default | outline | ghost`
|
|
44
|
+
- **Added** `color` prop on SelectTrigger: `default | error | success | warning`. Sets `aria-invalid` when error.
|
|
45
|
+
|
|
42
46
|
### v0.15.0
|
|
43
47
|
- **Changed** `lg` size font changed from `text-ds-lg` (18px) to `text-ds-md` (14px) — all input sizes now use 14px for consistency
|
|
44
48
|
|
|
@@ -46,6 +46,10 @@
|
|
|
46
46
|
- Normally omit `variant` on TabsTrigger — it inherits from TabsList via context. You CAN set it per-trigger to override.
|
|
47
47
|
|
|
48
48
|
## Changes
|
|
49
|
+
### v0.31.0
|
|
50
|
+
- **Added** `size` prop on TabsList: `sm | md | lg`. Scales height and trigger padding.
|
|
51
|
+
- **Added** `color` prop on TabsList: `accent | neutral`. Affects line variant indicator.
|
|
52
|
+
|
|
49
53
|
### v0.18.0
|
|
50
54
|
- **Fixed** Wrapped TabsList context provider value in `useMemo` for performance
|
|
51
55
|
|