@handamade/psi-react 0.5.0 → 0.6.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/dist/index.js +31 -31
- package/dist/manifest.json +20 -1
- package/dist/patterns.json +139 -0
- package/dist/styles.css +1 -1
- package/llms.txt +2 -0
- package/package.json +3 -3
package/dist/index.js
CHANGED
|
@@ -72,7 +72,7 @@ function Dn({
|
|
|
72
72
|
}
|
|
73
73
|
);
|
|
74
74
|
}
|
|
75
|
-
const ie = "_iconButton_1dldx_3", re = "_disabled_1dldx_29", se = "_size24_1dldx_37", ae = "_size32_1dldx_42", ce = "_size40_1dldx_47", le = "_size48_1dldx_52", de = "_accent_1dldx_60", ue = "_neutral_1dldx_72", _e = "_ghost_1dldx_84", he = "_danger_1dldx_96",
|
|
75
|
+
const ie = "_iconButton_1dldx_3", re = "_disabled_1dldx_29", se = "_size24_1dldx_37", ae = "_size32_1dldx_42", ce = "_size40_1dldx_47", le = "_size48_1dldx_52", de = "_accent_1dldx_60", ue = "_neutral_1dldx_72", _e = "_ghost_1dldx_84", he = "_danger_1dldx_96", y = {
|
|
76
76
|
iconButton: ie,
|
|
77
77
|
disabled: re,
|
|
78
78
|
size24: se,
|
|
@@ -84,15 +84,15 @@ const ie = "_iconButton_1dldx_3", re = "_disabled_1dldx_29", se = "_size24_1dldx
|
|
|
84
84
|
ghost: _e,
|
|
85
85
|
danger: he
|
|
86
86
|
}, ve = {
|
|
87
|
-
accent:
|
|
88
|
-
neutral:
|
|
89
|
-
ghost:
|
|
90
|
-
danger:
|
|
87
|
+
accent: y.accent,
|
|
88
|
+
neutral: y.neutral,
|
|
89
|
+
ghost: y.ghost,
|
|
90
|
+
danger: y.danger
|
|
91
91
|
}, fe = {
|
|
92
|
-
24:
|
|
93
|
-
32:
|
|
94
|
-
40:
|
|
95
|
-
48:
|
|
92
|
+
24: y.size24,
|
|
93
|
+
32: y.size32,
|
|
94
|
+
40: y.size40,
|
|
95
|
+
48: y.size48
|
|
96
96
|
};
|
|
97
97
|
function ge({
|
|
98
98
|
variant: e = "neutral",
|
|
@@ -107,10 +107,10 @@ function ge({
|
|
|
107
107
|
...h
|
|
108
108
|
}) {
|
|
109
109
|
const g = [
|
|
110
|
-
|
|
110
|
+
y.iconButton,
|
|
111
111
|
ve[e],
|
|
112
112
|
fe[t],
|
|
113
|
-
r !== void 0 && o ?
|
|
113
|
+
r !== void 0 && o ? y.disabled : void 0,
|
|
114
114
|
i
|
|
115
115
|
].filter(Boolean).join(" ");
|
|
116
116
|
return r !== void 0 ? /* @__PURE__ */ n(
|
|
@@ -136,10 +136,10 @@ function ge({
|
|
|
136
136
|
}
|
|
137
137
|
);
|
|
138
138
|
}
|
|
139
|
-
const be = "_card_1btb3_1",
|
|
139
|
+
const be = "_card_1btb3_1", ye = "_stacked_1btb3_8", pe = "_featured_1btb3_10", ke = "_media_1btb3_22", me = "_body_1btb3_23", xe = "_hoverLift_1btb3_31", m = {
|
|
140
140
|
card: be,
|
|
141
|
-
stacked:
|
|
142
|
-
featured:
|
|
141
|
+
stacked: ye,
|
|
142
|
+
featured: pe,
|
|
143
143
|
media: ke,
|
|
144
144
|
body: me,
|
|
145
145
|
hoverLift: xe
|
|
@@ -345,7 +345,7 @@ function _t({ size: e = 20, ...t }) {
|
|
|
345
345
|
/* @__PURE__ */ n("line", { x1: "17.5", y1: "6.5", x2: "17.51", y2: "6.5" })
|
|
346
346
|
] });
|
|
347
347
|
}
|
|
348
|
-
const Ae = "_dialog_j8ndn_2", Ee = "_w400_j8ndn_31", Ve = "_w560_j8ndn_32", qe = "_w720_j8ndn_33", Re = "_panel_j8ndn_35", De = "_header_j8ndn_41", Te = "_title_j8ndn_48", Fe = "_footer_j8ndn_54",
|
|
348
|
+
const Ae = "_dialog_j8ndn_2", Ee = "_w400_j8ndn_31", Ve = "_w560_j8ndn_32", qe = "_w720_j8ndn_33", Re = "_panel_j8ndn_35", De = "_header_j8ndn_41", Te = "_title_j8ndn_48", Fe = "_footer_j8ndn_54", p = {
|
|
349
349
|
dialog: Ae,
|
|
350
350
|
w400: Ee,
|
|
351
351
|
w560: Ve,
|
|
@@ -355,9 +355,9 @@ const Ae = "_dialog_j8ndn_2", Ee = "_w400_j8ndn_31", Ve = "_w560_j8ndn_32", qe =
|
|
|
355
355
|
title: Te,
|
|
356
356
|
footer: Fe
|
|
357
357
|
}, Pe = {
|
|
358
|
-
400:
|
|
359
|
-
560:
|
|
360
|
-
720:
|
|
358
|
+
400: p.w400,
|
|
359
|
+
560: p.w560,
|
|
360
|
+
720: p.w720
|
|
361
361
|
};
|
|
362
362
|
function ht({
|
|
363
363
|
open: e,
|
|
@@ -388,7 +388,7 @@ function ht({
|
|
|
388
388
|
_.preventDefault(), o && t("esc");
|
|
389
389
|
}, k = (_) => {
|
|
390
390
|
o && _.target === g.current && t("backdrop");
|
|
391
|
-
}, N = [
|
|
391
|
+
}, N = [p.dialog, Pe[a], i].filter(Boolean).join(" ");
|
|
392
392
|
return /* @__PURE__ */ n(
|
|
393
393
|
"dialog",
|
|
394
394
|
{
|
|
@@ -398,9 +398,9 @@ function ht({
|
|
|
398
398
|
onCancel: B,
|
|
399
399
|
onClick: k,
|
|
400
400
|
...h,
|
|
401
|
-
children: /* @__PURE__ */ c("div", { className:
|
|
402
|
-
(r != null || o) && /* @__PURE__ */ c("div", { className:
|
|
403
|
-
r != null && /* @__PURE__ */ n("h2", { id: v, className:
|
|
401
|
+
children: /* @__PURE__ */ c("div", { className: p.panel, children: [
|
|
402
|
+
(r != null || o) && /* @__PURE__ */ c("div", { className: p.header, children: [
|
|
403
|
+
r != null && /* @__PURE__ */ n("h2", { id: v, className: p.title, children: r }),
|
|
404
404
|
o && /* @__PURE__ */ n(
|
|
405
405
|
ge,
|
|
406
406
|
{
|
|
@@ -413,7 +413,7 @@ function ht({
|
|
|
413
413
|
)
|
|
414
414
|
] }),
|
|
415
415
|
l,
|
|
416
|
-
s != null && /* @__PURE__ */ n("div", { className:
|
|
416
|
+
s != null && /* @__PURE__ */ n("div", { className: p.footer, children: s })
|
|
417
417
|
] })
|
|
418
418
|
}
|
|
419
419
|
);
|
|
@@ -487,7 +487,7 @@ function ft({
|
|
|
487
487
|
}
|
|
488
488
|
);
|
|
489
489
|
}
|
|
490
|
-
const sn = "
|
|
490
|
+
const sn = "_label_thyza_3", an = "_disabled_thyza_13", cn = "_input_thyza_20", ln = "_indicator_thyza_34", dn = "_text_thyza_75", $ = {
|
|
491
491
|
label: sn,
|
|
492
492
|
disabled: an,
|
|
493
493
|
input: cn,
|
|
@@ -549,10 +549,10 @@ function bt({
|
|
|
549
549
|
e && /* @__PURE__ */ n("span", { className: w.text, children: e })
|
|
550
550
|
] });
|
|
551
551
|
}
|
|
552
|
-
const bn = "_tag_3oysa_3",
|
|
552
|
+
const bn = "_tag_3oysa_3", yn = "_dismiss_3oysa_17", pn = "_neutral_3oysa_43", kn = "_accent_3oysa_48", mn = "_success_3oysa_53", xn = "_warning_3oysa_58", wn = "_danger_3oysa_63", zn = "_neutralSubtle_3oysa_70", Cn = "_accentSubtle_3oysa_75", Ln = "_successSubtle_3oysa_80", Bn = "_warningSubtle_3oysa_85", jn = "_dangerSubtle_3oysa_90", b = {
|
|
553
553
|
tag: bn,
|
|
554
|
-
dismiss:
|
|
555
|
-
neutral:
|
|
554
|
+
dismiss: yn,
|
|
555
|
+
neutral: pn,
|
|
556
556
|
accent: kn,
|
|
557
557
|
success: mn,
|
|
558
558
|
warning: xn,
|
|
@@ -575,7 +575,7 @@ const bn = "_tag_3oysa_3", pn = "_dismiss_3oysa_17", yn = "_neutral_3oysa_43", k
|
|
|
575
575
|
warning: b.warningSubtle,
|
|
576
576
|
danger: b.dangerSubtle
|
|
577
577
|
};
|
|
578
|
-
function
|
|
578
|
+
function yt({
|
|
579
579
|
variant: e = "neutral",
|
|
580
580
|
subtle: t = !1,
|
|
581
581
|
onDismiss: r,
|
|
@@ -629,7 +629,7 @@ const Sn = "_wrapper_17qua_3", In = "_tooltip_17qua_10", Mn = "_top_17qua_24", W
|
|
|
629
629
|
left: L.left,
|
|
630
630
|
right: L.right
|
|
631
631
|
}, Vn = 150;
|
|
632
|
-
function
|
|
632
|
+
function pt({
|
|
633
633
|
content: e,
|
|
634
634
|
children: t,
|
|
635
635
|
placement: r = "top"
|
|
@@ -714,6 +714,6 @@ export {
|
|
|
714
714
|
Fn as NavBar,
|
|
715
715
|
ft as Select,
|
|
716
716
|
bt as Switch,
|
|
717
|
-
|
|
718
|
-
|
|
717
|
+
yt as Tag,
|
|
718
|
+
pt as Tooltip
|
|
719
719
|
};
|
package/dist/manifest.json
CHANGED
|
@@ -227,7 +227,26 @@
|
|
|
227
227
|
{
|
|
228
228
|
"name": "Field",
|
|
229
229
|
"description": "Labeled form-row wrapper: label above, control, one message line below — description normally, error when set (aria-live). Auto-wires id/aria-describedby/aria-invalid into Input and Select (D49).",
|
|
230
|
-
"slots": [
|
|
230
|
+
"slots": [
|
|
231
|
+
{
|
|
232
|
+
"name": "label",
|
|
233
|
+
"accepts": {},
|
|
234
|
+
"cardinality": "0..1",
|
|
235
|
+
"order": 1
|
|
236
|
+
},
|
|
237
|
+
{
|
|
238
|
+
"name": "body",
|
|
239
|
+
"accepts": {},
|
|
240
|
+
"cardinality": "1..*",
|
|
241
|
+
"order": 2
|
|
242
|
+
},
|
|
243
|
+
{
|
|
244
|
+
"name": "description",
|
|
245
|
+
"accepts": {},
|
|
246
|
+
"cardinality": "0..1",
|
|
247
|
+
"order": 3
|
|
248
|
+
}
|
|
249
|
+
],
|
|
231
250
|
"props": [
|
|
232
251
|
{
|
|
233
252
|
"name": "label",
|
|
@@ -0,0 +1,139 @@
|
|
|
1
|
+
{
|
|
2
|
+
"patterns": [
|
|
3
|
+
{
|
|
4
|
+
"id": "destructive-confirm",
|
|
5
|
+
"intent": "Dialog confirming a destructive action",
|
|
6
|
+
"match": [
|
|
7
|
+
"delete confirmation",
|
|
8
|
+
"are you sure",
|
|
9
|
+
"destructive dialog",
|
|
10
|
+
"confirm delete"
|
|
11
|
+
],
|
|
12
|
+
"compose": {
|
|
13
|
+
"component": "Dialog",
|
|
14
|
+
"slots": {
|
|
15
|
+
"title": [
|
|
16
|
+
"{content:title}"
|
|
17
|
+
],
|
|
18
|
+
"body": [
|
|
19
|
+
"{content:consequence}"
|
|
20
|
+
],
|
|
21
|
+
"footer": [
|
|
22
|
+
{
|
|
23
|
+
"component": "Button",
|
|
24
|
+
"props": {
|
|
25
|
+
"variant": "ghost",
|
|
26
|
+
"size": "{param:size}"
|
|
27
|
+
},
|
|
28
|
+
"content": "cancel-label"
|
|
29
|
+
},
|
|
30
|
+
{
|
|
31
|
+
"component": "Button",
|
|
32
|
+
"props": {
|
|
33
|
+
"variant": "danger",
|
|
34
|
+
"size": "{param:size}"
|
|
35
|
+
},
|
|
36
|
+
"content": "confirm-label"
|
|
37
|
+
}
|
|
38
|
+
]
|
|
39
|
+
}
|
|
40
|
+
},
|
|
41
|
+
"parameters": [
|
|
42
|
+
{
|
|
43
|
+
"key": "size",
|
|
44
|
+
"ask": "Button size?",
|
|
45
|
+
"options": [
|
|
46
|
+
32,
|
|
47
|
+
40
|
|
48
|
+
],
|
|
49
|
+
"default": 32
|
|
50
|
+
}
|
|
51
|
+
],
|
|
52
|
+
"content": {
|
|
53
|
+
"title": "<Delete the object?>",
|
|
54
|
+
"consequence": "<what is permanently lost>",
|
|
55
|
+
"cancel-label": "Cancel",
|
|
56
|
+
"confirm-label": "<verb the object>"
|
|
57
|
+
},
|
|
58
|
+
"gaps": [],
|
|
59
|
+
"blocked": false,
|
|
60
|
+
"preset": "<Dialog\n footer={<>\n <Button size={32} variant=\"ghost\">Cancel</Button>\n <Button size={32} variant=\"danger\"><verb the object></Button>\n </>}\n title=\"<Delete the object?>\"\n>\n <what is permanently lost>\n</Dialog>\n"
|
|
61
|
+
},
|
|
62
|
+
{
|
|
63
|
+
"id": "filter-toolbar",
|
|
64
|
+
"intent": "Toolbar of filter controls: search, category select, active-filter tags",
|
|
65
|
+
"match": [
|
|
66
|
+
"filter toolbar",
|
|
67
|
+
"filter bar",
|
|
68
|
+
"search and filter",
|
|
69
|
+
"faceted filters"
|
|
70
|
+
],
|
|
71
|
+
"compose": {
|
|
72
|
+
"component": "Toolbar",
|
|
73
|
+
"slots": {
|
|
74
|
+
"body": [
|
|
75
|
+
{
|
|
76
|
+
"component": "Input"
|
|
77
|
+
},
|
|
78
|
+
{
|
|
79
|
+
"component": "Select"
|
|
80
|
+
},
|
|
81
|
+
{
|
|
82
|
+
"component": "Tag",
|
|
83
|
+
"content": "example-filter"
|
|
84
|
+
}
|
|
85
|
+
]
|
|
86
|
+
}
|
|
87
|
+
},
|
|
88
|
+
"parameters": [],
|
|
89
|
+
"content": {
|
|
90
|
+
"example-filter": "<active filter>"
|
|
91
|
+
},
|
|
92
|
+
"gaps": [
|
|
93
|
+
"Toolbar"
|
|
94
|
+
],
|
|
95
|
+
"blocked": true,
|
|
96
|
+
"preset": null
|
|
97
|
+
},
|
|
98
|
+
{
|
|
99
|
+
"id": "settings-form-row",
|
|
100
|
+
"intent": "Labeled settings row: a self-labeled control with a group label and helper text",
|
|
101
|
+
"match": [
|
|
102
|
+
"settings row",
|
|
103
|
+
"form row",
|
|
104
|
+
"labeled switch",
|
|
105
|
+
"preference toggle",
|
|
106
|
+
"settings form"
|
|
107
|
+
],
|
|
108
|
+
"compose": {
|
|
109
|
+
"component": "Field",
|
|
110
|
+
"props": {
|
|
111
|
+
"group": true
|
|
112
|
+
},
|
|
113
|
+
"slots": {
|
|
114
|
+
"label": [
|
|
115
|
+
"{content:row-label}"
|
|
116
|
+
],
|
|
117
|
+
"body": [
|
|
118
|
+
{
|
|
119
|
+
"component": "Switch",
|
|
120
|
+
"content": "control-label"
|
|
121
|
+
}
|
|
122
|
+
],
|
|
123
|
+
"description": [
|
|
124
|
+
"{content:row-description}"
|
|
125
|
+
]
|
|
126
|
+
}
|
|
127
|
+
},
|
|
128
|
+
"parameters": [],
|
|
129
|
+
"content": {
|
|
130
|
+
"row-label": "<setting name>",
|
|
131
|
+
"control-label": "<what turning it on does>",
|
|
132
|
+
"row-description": "<one-line consequence of the setting>"
|
|
133
|
+
},
|
|
134
|
+
"gaps": [],
|
|
135
|
+
"blocked": false,
|
|
136
|
+
"preset": "<Field\n description=\"<one-line consequence of the setting>\"\n group={true}\n label=\"<setting name>\"\n>\n <Switch><what turning it on does></Switch>\n</Field>\n"
|
|
137
|
+
}
|
|
138
|
+
]
|
|
139
|
+
}
|
package/dist/styles.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
._button_m8fis_3{display:inline-flex;align-items:center;justify-content:center;gap:var(--psi-space-6);border:none;border-radius:var(--psi-radius-8);cursor:pointer;font-family:var(--psi-font-sans);white-space:nowrap;text-decoration:none;-webkit-user-select:none;user-select:none;transition:background-color var(--psi-duration-150) var(--psi-ease-standard),color var(--psi-duration-150) var(--psi-ease-standard)}._button_m8fis_3:focus-visible{outline:2px solid var(--psi-button-focus-ring);outline-offset:2px}._button_m8fis_3:disabled{opacity:.4;cursor:not-allowed}._button_m8fis_3._disabled_m8fis_31{opacity:.4;cursor:not-allowed;pointer-events:none}._size24_m8fis_39{height:var(--psi-size-24);padding-inline:var(--psi-space-8);font:var(--psi-button-font, var(--psi-text-12-16-medium))}._size32_m8fis_45{height:var(--psi-size-32);padding-inline:var(--psi-space-12);font:var(--psi-button-font, var(--psi-text-14-20-medium))}._size40_m8fis_51{height:var(--psi-size-40);padding-inline:var(--psi-space-16);font:var(--psi-button-font, var(--psi-text-16-24-medium))}._size48_m8fis_57{height:var(--psi-size-48);padding-inline:var(--psi-space-20);font:var(--psi-button-font, var(--psi-text-18-28-medium))}._accent_m8fis_66{background:var(--psi-button-accent-bg);color:var(--psi-button-accent-fg)}._accent_m8fis_66:hover:not(:disabled):not(._disabled_m8fis_31){background:var(--psi-button-accent-bg-hover)}._accent_m8fis_66:active:not(:disabled):not(._disabled_m8fis_31){background:var(--psi-button-accent-bg-active)}._accentSubtle_m8fis_78{background:var(--psi-button-accent-subtle-bg);color:var(--psi-button-accent-subtle-fg)}._accentSubtle_m8fis_78:hover:not(:disabled):not(._disabled_m8fis_31){background:var(--psi-button-accent-subtle-bg-hover)}._accentSubtle_m8fis_78:active:not(:disabled):not(._disabled_m8fis_31){background:var(--psi-button-accent-subtle-bg-active)}._neutral_m8fis_90{background:var(--psi-button-neutral-bg);color:var(--psi-button-neutral-fg)}._neutral_m8fis_90:hover:not(:disabled):not(._disabled_m8fis_31){background:var(--psi-button-neutral-bg-hover)}._neutral_m8fis_90:active:not(:disabled):not(._disabled_m8fis_31){background:var(--psi-button-neutral-bg-active)}._neutralSubtle_m8fis_102{background:var(--psi-button-neutral-subtle-bg);color:var(--psi-button-neutral-subtle-fg)}._neutralSubtle_m8fis_102:hover:not(:disabled):not(._disabled_m8fis_31){background:var(--psi-button-neutral-subtle-bg-hover)}._neutralSubtle_m8fis_102:active:not(:disabled):not(._disabled_m8fis_31){background:var(--psi-button-neutral-subtle-bg-active)}._ghost_m8fis_114{background:var(--psi-button-ghost-bg);color:var(--psi-button-ghost-fg)}._ghost_m8fis_114:hover:not(:disabled):not(._disabled_m8fis_31){background:var(--psi-button-ghost-bg-hover)}._ghost_m8fis_114:active:not(:disabled):not(._disabled_m8fis_31){background:var(--psi-button-ghost-bg-active)}._danger_m8fis_126{background:var(--psi-button-danger-bg);color:var(--psi-button-danger-fg)}._danger_m8fis_126:hover:not(:disabled):not(._disabled_m8fis_31){background:var(--psi-button-danger-bg-hover)}._danger_m8fis_126:active:not(:disabled):not(._disabled_m8fis_31){background:var(--psi-button-danger-bg-active)}._dangerSubtle_m8fis_138{background:var(--psi-button-danger-subtle-bg);color:var(--psi-button-danger-subtle-fg)}._dangerSubtle_m8fis_138:hover:not(:disabled):not(._disabled_m8fis_31){background:var(--psi-button-danger-subtle-bg-hover)}._dangerSubtle_m8fis_138:active:not(:disabled):not(._disabled_m8fis_31){background:var(--psi-button-danger-subtle-bg-active)}._outline_m8fis_150{background:var(--psi-button-outline-bg);color:var(--psi-button-outline-fg);border:1px solid var(--psi-button-outline-border)}._outline_m8fis_150:hover:not(:disabled):not(._disabled_m8fis_31){background:var(--psi-button-outline-bg-hover);color:var(--psi-button-outline-fg-hover);border-color:transparent}._outline_m8fis_150:active:not(:disabled):not(._disabled_m8fis_31){background:var(--psi-button-outline-bg-active)}._iconButton_1dldx_3{display:inline-flex;align-items:center;justify-content:center;border:none;border-radius:var(--psi-radius-8);cursor:pointer;padding:0;text-decoration:none;-webkit-user-select:none;user-select:none;transition:background-color var(--psi-duration-150) var(--psi-ease-standard),color var(--psi-duration-150) var(--psi-ease-standard)}._iconButton_1dldx_3:focus-visible{outline:2px solid var(--psi-button-focus-ring);outline-offset:2px}._iconButton_1dldx_3:disabled{opacity:.4;cursor:not-allowed}._iconButton_1dldx_3._disabled_1dldx_29{opacity:.4;cursor:not-allowed;pointer-events:none}._size24_1dldx_37{width:var(--psi-size-24);height:var(--psi-size-24)}._size32_1dldx_42{width:var(--psi-size-32);height:var(--psi-size-32)}._size40_1dldx_47{width:var(--psi-size-40);height:var(--psi-size-40)}._size48_1dldx_52{width:var(--psi-size-48);height:var(--psi-size-48)}._accent_1dldx_60{background:var(--psi-button-accent-bg);color:var(--psi-button-accent-fg)}._accent_1dldx_60:hover:not(:disabled):not(._disabled_1dldx_29){background:var(--psi-button-accent-bg-hover)}._accent_1dldx_60:active:not(:disabled):not(._disabled_1dldx_29){background:var(--psi-button-accent-bg-active)}._neutral_1dldx_72{background:var(--psi-button-neutral-bg);color:var(--psi-button-neutral-fg)}._neutral_1dldx_72:hover:not(:disabled):not(._disabled_1dldx_29){background:var(--psi-button-neutral-bg-hover)}._neutral_1dldx_72:active:not(:disabled):not(._disabled_1dldx_29){background:var(--psi-button-neutral-bg-active)}._ghost_1dldx_84{background:var(--psi-button-ghost-bg);color:var(--psi-button-ghost-fg)}._ghost_1dldx_84:hover:not(:disabled):not(._disabled_1dldx_29){background:var(--psi-button-ghost-bg-hover)}._ghost_1dldx_84:active:not(:disabled):not(._disabled_1dldx_29){background:var(--psi-button-ghost-bg-active)}._danger_1dldx_96{background:var(--psi-button-danger-bg);color:var(--psi-button-danger-fg)}._danger_1dldx_96:hover:not(:disabled):not(._disabled_1dldx_29){background:var(--psi-button-danger-bg-hover)}._danger_1dldx_96:active:not(:disabled):not(._disabled_1dldx_29){background:var(--psi-button-danger-bg-active)}._card_1btb3_1{background:var(--psi-card-bg);border:1px solid var(--psi-card-border);border-radius:var(--psi-card-radius);overflow:hidden}._stacked_1btb3_8{display:flex;flex-direction:column;gap:var(--psi-card-gap)}._featured_1btb3_10{display:grid;grid-template-columns:1.6fr 1fr;gap:var(--psi-card-gap);align-items:start}@media(max-width:960px){._featured_1btb3_10{grid-template-columns:1fr}}._media_1btb3_22{min-width:0}._body_1btb3_23{min-width:0;display:flex;flex-direction:column;gap:var(--psi-card-gap);padding:var(--psi-card-gap)}._hoverLift_1btb3_31{transition:transform var(--psi-duration-350) var(--psi-ease-standard)}._hoverLift_1btb3_31:hover{transform:translateY(-6px)}._navbar_1uory_1{position:sticky;top:0;z-index:var(--psi-z-nav);background:var(--psi-navbar-bg);backdrop-filter:blur(var(--psi-navbar-blur));-webkit-backdrop-filter:blur(var(--psi-navbar-blur));border-bottom:1px solid var(--psi-navbar-border)}._inner_1uory_11{display:flex;align-items:center;gap:var(--psi-space-24);height:var(--psi-navbar-height)}._brand_1uory_18{display:flex;align-items:center}._links_1uory_19{display:flex;align-items:center;gap:var(--psi-space-20);margin-inline-start:auto}._links_1uory_19 a,._brand_1uory_18 a{text-decoration:none;transition:color var(--psi-duration-150) var(--psi-ease-soft)}._links_1uory_19 a{color:var(--psi-navbar-link-fg)}._links_1uory_19 a:hover,._brand_1uory_18 a{color:var(--psi-navbar-link-fg-hover)}._links_1uory_19 a:focus-visible,._brand_1uory_18 a:focus-visible{outline:2px solid var(--psi-navbar-focus-ring);outline-offset:2px}._actions_1uory_49{display:flex;align-items:center;gap:var(--psi-space-8)}._frame_et4fc_1{overflow:hidden}._frame_et4fc_1>img,._frame_et4fc_1>video{width:100%;height:100%;object-fit:cover;display:block}._field_lplye_1{display:grid;gap:var(--psi-field-gap);border:0;margin:0;padding:0;min-width:0}._label_lplye_10{font:var(--psi-text-14-20-medium);color:var(--psi-field-label-fg);padding:0}._marker_lplye_16{color:var(--psi-field-marker-fg)}._message_lplye_20{margin:0;font:var(--psi-text-12-16-regular);color:var(--psi-field-message-fg)}._invalid_lplye_26 ._message_lplye_20{color:var(--psi-field-error-fg)}._dialog_j8ndn_2{padding:0;border:1px solid var(--psi-dialog-border);border-radius:var(--psi-radius-12);background:var(--psi-dialog-bg);color:var(--psi-dialog-fg);max-width:calc(100vw - var(--psi-space-32))}._dialog_j8ndn_2::backdrop{background:var(--psi-dialog-backdrop)}._dialog_j8ndn_2[open]{animation:_dialog-enter_j8ndn_1 var(--psi-duration-200) var(--psi-ease-soft)}._dialog_j8ndn_2[open]::backdrop{animation:_backdrop-enter_j8ndn_1 var(--psi-duration-200) var(--psi-ease-soft)}@keyframes _dialog-enter_j8ndn_1{0%{opacity:0;transform:scale(.97)}}@keyframes _backdrop-enter_j8ndn_1{0%{opacity:0}}._w400_j8ndn_31{width:400px}._w560_j8ndn_32{width:560px}._w720_j8ndn_33{width:720px}._panel_j8ndn_35{display:grid;gap:var(--psi-space-16);padding:var(--psi-space-24)}._header_j8ndn_41{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--psi-space-12)}._title_j8ndn_48{margin:0;font:var(--psi-text-18-28-medium);color:var(--psi-dialog-title-fg)}._footer_j8ndn_54{display:flex;justify-content:flex-end;gap:var(--psi-space-8)}._input_8tzcf_3{display:block;width:100%;border:1px solid var(--psi-input-border);border-radius:var(--psi-radius-8);background:var(--psi-input-bg);color:var(--psi-input-fg);font-family:var(--psi-font-sans);padding-inline:var(--psi-space-8);transition:border-color var(--psi-duration-150) var(--psi-ease-standard),outline var(--psi-duration-150) var(--psi-ease-standard)}._input_8tzcf_3::placeholder{color:var(--psi-input-placeholder)}._input_8tzcf_3:hover:not(:disabled):not(:focus){border-color:var(--psi-input-border-hover)}._input_8tzcf_3:focus{outline:2px solid var(--psi-input-focus-ring);outline-offset:-1px;border-color:transparent}._input_8tzcf_3:disabled{opacity:.4;cursor:not-allowed}._size24_8tzcf_38{height:var(--psi-size-24);font:var(--psi-text-12-16-regular)}._size32_8tzcf_43{height:var(--psi-size-32);font:var(--psi-text-14-20-regular)}._size40_8tzcf_48{height:var(--psi-size-40);font:var(--psi-text-16-24-regular)}._size48_8tzcf_53{height:var(--psi-size-48);font:var(--psi-text-18-28-medium)}._error_8tzcf_60{border-color:var(--psi-input-border-error)}._error_8tzcf_60:hover:not(:disabled):not(:focus){border-color:var(--psi-input-border-error)}._select_140kg_3{display:block;width:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid var(--psi-select-border);border-radius:var(--psi-radius-8);background-color:var(--psi-select-bg);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right var(--psi-space-8) center;color:var(--psi-select-fg);font-family:var(--psi-font-sans);padding-inline-start:var(--psi-space-8);padding-inline-end:var(--psi-space-24);cursor:pointer;transition:border-color var(--psi-duration-150) var(--psi-ease-standard),outline var(--psi-duration-150) var(--psi-ease-standard)}._select_140kg_3:hover:not(:disabled):not(:focus){border-color:var(--psi-select-border-hover)}._select_140kg_3:focus{outline:2px solid var(--psi-select-focus-ring);outline-offset:-1px;border-color:transparent}._select_140kg_3:disabled{opacity:.4;cursor:not-allowed}._size24_140kg_40{height:var(--psi-size-24);font:var(--psi-text-12-16-regular)}._size32_140kg_45{height:var(--psi-size-32);font:var(--psi-text-14-20-regular)}._size40_140kg_50{height:var(--psi-size-40);font:var(--psi-text-16-24-regular)}._size48_140kg_55{height:var(--psi-size-48);font:var(--psi-text-18-28-medium)}._error_140kg_62{border-color:var(--psi-select-border-error)}._error_140kg_62:hover:not(:disabled):not(:focus){border-color:var(--psi-select-border-error)}._label_n457n_3{display:inline-flex;align-items:center;gap:var(--psi-space-8);cursor:pointer;-webkit-user-select:none;user-select:none;font:var(--psi-text-14-20-regular);color:var(--psi-checkbox-fg)}._disabled_n457n_13{opacity:.4;cursor:not-allowed}._input_n457n_20{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}._indicator_n457n_34{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;flex-shrink:0;border:1px solid var(--psi-checkbox-box-border);border-radius:var(--psi-radius-4);background:var(--psi-checkbox-box-bg);transition:background-color var(--psi-duration-150) var(--psi-ease-standard),border-color var(--psi-duration-150) var(--psi-ease-standard)}._input_n457n_20:checked+._indicator_n457n_34{background:var(--psi-checkbox-box-bg-checked);border-color:var(--psi-checkbox-box-border-checked)}._input_n457n_20:checked+._indicator_n457n_34:after{content:"";display:block;width:4px;height:8px;border:solid var(--psi-checkbox-check-fg);border-width:0 2px 2px 0;transform:rotate(45deg) translate(-.5px,-.5px)}._input_n457n_20:focus-visible+._indicator_n457n_34{outline:2px solid var(--psi-checkbox-focus-ring);outline-offset:2px}._text_n457n_74{color:var(--psi-checkbox-fg)}._label_jru2c_3{display:inline-flex;align-items:center;gap:var(--psi-space-8);cursor:pointer;-webkit-user-select:none;user-select:none;font:var(--psi-text-14-20-regular);color:var(--psi-switch-fg)}._disabled_jru2c_13{opacity:.4;cursor:not-allowed}._input_jru2c_20{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}._track_jru2c_34{position:relative;display:inline-flex;align-items:center;width:36px;height:20px;flex-shrink:0;border-radius:var(--psi-radius-full);background:var(--psi-switch-track-bg);transition:background-color var(--psi-duration-150) var(--psi-ease-standard)}._input_jru2c_20:checked+._track_jru2c_34{background:var(--psi-switch-track-bg-checked)}._input_jru2c_20:focus-visible+._track_jru2c_34{outline:2px solid var(--psi-switch-focus-ring);outline-offset:2px}._thumb_jru2c_58{position:absolute;width:16px;height:16px;border-radius:var(--psi-radius-full);background:var(--psi-switch-thumb-bg);left:2px;transition:left var(--psi-duration-150) var(--psi-ease-standard);box-shadow:0 1px 2px #00000029}._input_jru2c_20:checked+._track_jru2c_34 ._thumb_jru2c_58{left:18px}._text_jru2c_75{color:var(--psi-switch-fg)}._tag_3oysa_3{display:inline-flex;align-items:center;gap:var(--psi-space-4);height:24px;padding-inline:var(--psi-space-8);border-radius:var(--psi-radius-full);font:var(--psi-text-12-16-medium);white-space:nowrap;-webkit-user-select:none;user-select:none}._dismiss_3oysa_17{display:inline-flex;align-items:center;justify-content:center;padding:0;border:none;background:none;color:inherit;cursor:pointer;opacity:.7;margin-inline-start:var(--psi-space-2);margin-inline-end:calc(-1 * var(--psi-space-4));border-radius:var(--psi-radius-full)}._dismiss_3oysa_17:hover{opacity:1}._dismiss_3oysa_17:focus-visible{outline:2px solid var(--psi-tag-focus-ring);outline-offset:2px}._neutral_3oysa_43{background:var(--psi-tag-neutral-bg);color:var(--psi-tag-neutral-fg)}._accent_3oysa_48{background:var(--psi-tag-accent-bg);color:var(--psi-tag-accent-fg)}._success_3oysa_53{background:var(--psi-tag-success-bg);color:var(--psi-tag-success-fg)}._warning_3oysa_58{background:var(--psi-tag-warning-bg);color:var(--psi-tag-warning-fg)}._danger_3oysa_63{background:var(--psi-tag-danger-bg);color:var(--psi-tag-danger-fg)}._neutralSubtle_3oysa_70{background:var(--psi-tag-neutral-subtle-bg);color:var(--psi-tag-neutral-subtle-fg)}._accentSubtle_3oysa_75{background:var(--psi-tag-accent-subtle-bg);color:var(--psi-tag-accent-subtle-fg)}._successSubtle_3oysa_80{background:var(--psi-tag-success-subtle-bg);color:var(--psi-tag-success-subtle-fg)}._warningSubtle_3oysa_85{background:var(--psi-tag-warning-subtle-bg);color:var(--psi-tag-warning-subtle-fg)}._dangerSubtle_3oysa_90{background:var(--psi-tag-danger-subtle-bg);color:var(--psi-tag-danger-subtle-fg)}._wrapper_17qua_3{position:relative;display:inline-flex}._tooltip_17qua_10{position:absolute;z-index:var(--psi-z-tooltip);padding:var(--psi-space-4) var(--psi-space-8);border-radius:var(--psi-radius-6);background:var(--psi-tooltip-bg);color:var(--psi-tooltip-fg);font:var(--psi-text-12-16-regular);white-space:nowrap;pointer-events:none}._top_17qua_24{bottom:100%;left:50%;transform:translate(-50%);margin-bottom:var(--psi-space-4)}._bottom_17qua_31{top:100%;left:50%;transform:translate(-50%);margin-top:var(--psi-space-4)}._left_17qua_38{right:100%;top:50%;transform:translateY(-50%);margin-right:var(--psi-space-4)}._right_17qua_45{left:100%;top:50%;transform:translateY(-50%);margin-left:var(--psi-space-4)}
|
|
1
|
+
._button_m8fis_3{display:inline-flex;align-items:center;justify-content:center;gap:var(--psi-space-6);border:none;border-radius:var(--psi-radius-8);cursor:pointer;font-family:var(--psi-font-sans);white-space:nowrap;text-decoration:none;-webkit-user-select:none;user-select:none;transition:background-color var(--psi-duration-150) var(--psi-ease-standard),color var(--psi-duration-150) var(--psi-ease-standard)}._button_m8fis_3:focus-visible{outline:2px solid var(--psi-button-focus-ring);outline-offset:2px}._button_m8fis_3:disabled{opacity:.4;cursor:not-allowed}._button_m8fis_3._disabled_m8fis_31{opacity:.4;cursor:not-allowed;pointer-events:none}._size24_m8fis_39{height:var(--psi-size-24);padding-inline:var(--psi-space-8);font:var(--psi-button-font, var(--psi-text-12-16-medium))}._size32_m8fis_45{height:var(--psi-size-32);padding-inline:var(--psi-space-12);font:var(--psi-button-font, var(--psi-text-14-20-medium))}._size40_m8fis_51{height:var(--psi-size-40);padding-inline:var(--psi-space-16);font:var(--psi-button-font, var(--psi-text-16-24-medium))}._size48_m8fis_57{height:var(--psi-size-48);padding-inline:var(--psi-space-20);font:var(--psi-button-font, var(--psi-text-18-28-medium))}._accent_m8fis_66{background:var(--psi-button-accent-bg);color:var(--psi-button-accent-fg)}._accent_m8fis_66:hover:not(:disabled):not(._disabled_m8fis_31){background:var(--psi-button-accent-bg-hover)}._accent_m8fis_66:active:not(:disabled):not(._disabled_m8fis_31){background:var(--psi-button-accent-bg-active)}._accentSubtle_m8fis_78{background:var(--psi-button-accent-subtle-bg);color:var(--psi-button-accent-subtle-fg)}._accentSubtle_m8fis_78:hover:not(:disabled):not(._disabled_m8fis_31){background:var(--psi-button-accent-subtle-bg-hover)}._accentSubtle_m8fis_78:active:not(:disabled):not(._disabled_m8fis_31){background:var(--psi-button-accent-subtle-bg-active)}._neutral_m8fis_90{background:var(--psi-button-neutral-bg);color:var(--psi-button-neutral-fg)}._neutral_m8fis_90:hover:not(:disabled):not(._disabled_m8fis_31){background:var(--psi-button-neutral-bg-hover)}._neutral_m8fis_90:active:not(:disabled):not(._disabled_m8fis_31){background:var(--psi-button-neutral-bg-active)}._neutralSubtle_m8fis_102{background:var(--psi-button-neutral-subtle-bg);color:var(--psi-button-neutral-subtle-fg)}._neutralSubtle_m8fis_102:hover:not(:disabled):not(._disabled_m8fis_31){background:var(--psi-button-neutral-subtle-bg-hover)}._neutralSubtle_m8fis_102:active:not(:disabled):not(._disabled_m8fis_31){background:var(--psi-button-neutral-subtle-bg-active)}._ghost_m8fis_114{background:var(--psi-button-ghost-bg);color:var(--psi-button-ghost-fg)}._ghost_m8fis_114:hover:not(:disabled):not(._disabled_m8fis_31){background:var(--psi-button-ghost-bg-hover)}._ghost_m8fis_114:active:not(:disabled):not(._disabled_m8fis_31){background:var(--psi-button-ghost-bg-active)}._danger_m8fis_126{background:var(--psi-button-danger-bg);color:var(--psi-button-danger-fg)}._danger_m8fis_126:hover:not(:disabled):not(._disabled_m8fis_31){background:var(--psi-button-danger-bg-hover)}._danger_m8fis_126:active:not(:disabled):not(._disabled_m8fis_31){background:var(--psi-button-danger-bg-active)}._dangerSubtle_m8fis_138{background:var(--psi-button-danger-subtle-bg);color:var(--psi-button-danger-subtle-fg)}._dangerSubtle_m8fis_138:hover:not(:disabled):not(._disabled_m8fis_31){background:var(--psi-button-danger-subtle-bg-hover)}._dangerSubtle_m8fis_138:active:not(:disabled):not(._disabled_m8fis_31){background:var(--psi-button-danger-subtle-bg-active)}._outline_m8fis_150{background:var(--psi-button-outline-bg);color:var(--psi-button-outline-fg);border:1px solid var(--psi-button-outline-border)}._outline_m8fis_150:hover:not(:disabled):not(._disabled_m8fis_31){background:var(--psi-button-outline-bg-hover);color:var(--psi-button-outline-fg-hover);border-color:transparent}._outline_m8fis_150:active:not(:disabled):not(._disabled_m8fis_31){background:var(--psi-button-outline-bg-active)}._iconButton_1dldx_3{display:inline-flex;align-items:center;justify-content:center;border:none;border-radius:var(--psi-radius-8);cursor:pointer;padding:0;text-decoration:none;-webkit-user-select:none;user-select:none;transition:background-color var(--psi-duration-150) var(--psi-ease-standard),color var(--psi-duration-150) var(--psi-ease-standard)}._iconButton_1dldx_3:focus-visible{outline:2px solid var(--psi-button-focus-ring);outline-offset:2px}._iconButton_1dldx_3:disabled{opacity:.4;cursor:not-allowed}._iconButton_1dldx_3._disabled_1dldx_29{opacity:.4;cursor:not-allowed;pointer-events:none}._size24_1dldx_37{width:var(--psi-size-24);height:var(--psi-size-24)}._size32_1dldx_42{width:var(--psi-size-32);height:var(--psi-size-32)}._size40_1dldx_47{width:var(--psi-size-40);height:var(--psi-size-40)}._size48_1dldx_52{width:var(--psi-size-48);height:var(--psi-size-48)}._accent_1dldx_60{background:var(--psi-button-accent-bg);color:var(--psi-button-accent-fg)}._accent_1dldx_60:hover:not(:disabled):not(._disabled_1dldx_29){background:var(--psi-button-accent-bg-hover)}._accent_1dldx_60:active:not(:disabled):not(._disabled_1dldx_29){background:var(--psi-button-accent-bg-active)}._neutral_1dldx_72{background:var(--psi-button-neutral-bg);color:var(--psi-button-neutral-fg)}._neutral_1dldx_72:hover:not(:disabled):not(._disabled_1dldx_29){background:var(--psi-button-neutral-bg-hover)}._neutral_1dldx_72:active:not(:disabled):not(._disabled_1dldx_29){background:var(--psi-button-neutral-bg-active)}._ghost_1dldx_84{background:var(--psi-button-ghost-bg);color:var(--psi-button-ghost-fg)}._ghost_1dldx_84:hover:not(:disabled):not(._disabled_1dldx_29){background:var(--psi-button-ghost-bg-hover)}._ghost_1dldx_84:active:not(:disabled):not(._disabled_1dldx_29){background:var(--psi-button-ghost-bg-active)}._danger_1dldx_96{background:var(--psi-button-danger-bg);color:var(--psi-button-danger-fg)}._danger_1dldx_96:hover:not(:disabled):not(._disabled_1dldx_29){background:var(--psi-button-danger-bg-hover)}._danger_1dldx_96:active:not(:disabled):not(._disabled_1dldx_29){background:var(--psi-button-danger-bg-active)}._card_1btb3_1{background:var(--psi-card-bg);border:1px solid var(--psi-card-border);border-radius:var(--psi-card-radius);overflow:hidden}._stacked_1btb3_8{display:flex;flex-direction:column;gap:var(--psi-card-gap)}._featured_1btb3_10{display:grid;grid-template-columns:1.6fr 1fr;gap:var(--psi-card-gap);align-items:start}@media(max-width:960px){._featured_1btb3_10{grid-template-columns:1fr}}._media_1btb3_22{min-width:0}._body_1btb3_23{min-width:0;display:flex;flex-direction:column;gap:var(--psi-card-gap);padding:var(--psi-card-gap)}._hoverLift_1btb3_31{transition:transform var(--psi-duration-350) var(--psi-ease-standard)}._hoverLift_1btb3_31:hover{transform:translateY(-6px)}._navbar_1uory_1{position:sticky;top:0;z-index:var(--psi-z-nav);background:var(--psi-navbar-bg);backdrop-filter:blur(var(--psi-navbar-blur));-webkit-backdrop-filter:blur(var(--psi-navbar-blur));border-bottom:1px solid var(--psi-navbar-border)}._inner_1uory_11{display:flex;align-items:center;gap:var(--psi-space-24);height:var(--psi-navbar-height)}._brand_1uory_18{display:flex;align-items:center}._links_1uory_19{display:flex;align-items:center;gap:var(--psi-space-20);margin-inline-start:auto}._links_1uory_19 a,._brand_1uory_18 a{text-decoration:none;transition:color var(--psi-duration-150) var(--psi-ease-soft)}._links_1uory_19 a{color:var(--psi-navbar-link-fg)}._links_1uory_19 a:hover,._brand_1uory_18 a{color:var(--psi-navbar-link-fg-hover)}._links_1uory_19 a:focus-visible,._brand_1uory_18 a:focus-visible{outline:2px solid var(--psi-navbar-focus-ring);outline-offset:2px}._actions_1uory_49{display:flex;align-items:center;gap:var(--psi-space-8)}._frame_et4fc_1{overflow:hidden}._frame_et4fc_1>img,._frame_et4fc_1>video{width:100%;height:100%;object-fit:cover;display:block}._field_lplye_1{display:grid;gap:var(--psi-field-gap);border:0;margin:0;padding:0;min-width:0}._label_lplye_10{font:var(--psi-text-14-20-medium);color:var(--psi-field-label-fg);padding:0}._marker_lplye_16{color:var(--psi-field-marker-fg)}._message_lplye_20{margin:0;font:var(--psi-text-12-16-regular);color:var(--psi-field-message-fg)}._invalid_lplye_26 ._message_lplye_20{color:var(--psi-field-error-fg)}._dialog_j8ndn_2{padding:0;border:1px solid var(--psi-dialog-border);border-radius:var(--psi-radius-12);background:var(--psi-dialog-bg);color:var(--psi-dialog-fg);max-width:calc(100vw - var(--psi-space-32))}._dialog_j8ndn_2::backdrop{background:var(--psi-dialog-backdrop)}._dialog_j8ndn_2[open]{animation:_dialog-enter_j8ndn_1 var(--psi-duration-200) var(--psi-ease-soft)}._dialog_j8ndn_2[open]::backdrop{animation:_backdrop-enter_j8ndn_1 var(--psi-duration-200) var(--psi-ease-soft)}@keyframes _dialog-enter_j8ndn_1{0%{opacity:0;transform:scale(.97)}}@keyframes _backdrop-enter_j8ndn_1{0%{opacity:0}}._w400_j8ndn_31{width:400px}._w560_j8ndn_32{width:560px}._w720_j8ndn_33{width:720px}._panel_j8ndn_35{display:grid;gap:var(--psi-space-16);padding:var(--psi-space-24)}._header_j8ndn_41{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--psi-space-12)}._title_j8ndn_48{margin:0;font:var(--psi-text-18-28-medium);color:var(--psi-dialog-title-fg)}._footer_j8ndn_54{display:flex;justify-content:flex-end;gap:var(--psi-space-8)}._input_8tzcf_3{display:block;width:100%;border:1px solid var(--psi-input-border);border-radius:var(--psi-radius-8);background:var(--psi-input-bg);color:var(--psi-input-fg);font-family:var(--psi-font-sans);padding-inline:var(--psi-space-8);transition:border-color var(--psi-duration-150) var(--psi-ease-standard),outline var(--psi-duration-150) var(--psi-ease-standard)}._input_8tzcf_3::placeholder{color:var(--psi-input-placeholder)}._input_8tzcf_3:hover:not(:disabled):not(:focus){border-color:var(--psi-input-border-hover)}._input_8tzcf_3:focus{outline:2px solid var(--psi-input-focus-ring);outline-offset:-1px;border-color:transparent}._input_8tzcf_3:disabled{opacity:.4;cursor:not-allowed}._size24_8tzcf_38{height:var(--psi-size-24);font:var(--psi-text-12-16-regular)}._size32_8tzcf_43{height:var(--psi-size-32);font:var(--psi-text-14-20-regular)}._size40_8tzcf_48{height:var(--psi-size-40);font:var(--psi-text-16-24-regular)}._size48_8tzcf_53{height:var(--psi-size-48);font:var(--psi-text-18-28-medium)}._error_8tzcf_60{border-color:var(--psi-input-border-error)}._error_8tzcf_60:hover:not(:disabled):not(:focus){border-color:var(--psi-input-border-error)}._select_140kg_3{display:block;width:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid var(--psi-select-border);border-radius:var(--psi-radius-8);background-color:var(--psi-select-bg);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right var(--psi-space-8) center;color:var(--psi-select-fg);font-family:var(--psi-font-sans);padding-inline-start:var(--psi-space-8);padding-inline-end:var(--psi-space-24);cursor:pointer;transition:border-color var(--psi-duration-150) var(--psi-ease-standard),outline var(--psi-duration-150) var(--psi-ease-standard)}._select_140kg_3:hover:not(:disabled):not(:focus){border-color:var(--psi-select-border-hover)}._select_140kg_3:focus{outline:2px solid var(--psi-select-focus-ring);outline-offset:-1px;border-color:transparent}._select_140kg_3:disabled{opacity:.4;cursor:not-allowed}._size24_140kg_40{height:var(--psi-size-24);font:var(--psi-text-12-16-regular)}._size32_140kg_45{height:var(--psi-size-32);font:var(--psi-text-14-20-regular)}._size40_140kg_50{height:var(--psi-size-40);font:var(--psi-text-16-24-regular)}._size48_140kg_55{height:var(--psi-size-48);font:var(--psi-text-18-28-medium)}._error_140kg_62{border-color:var(--psi-select-border-error)}._error_140kg_62:hover:not(:disabled):not(:focus){border-color:var(--psi-select-border-error)}._label_thyza_3{display:inline-flex;align-items:center;gap:var(--psi-space-8);cursor:pointer;-webkit-user-select:none;user-select:none;font:var(--psi-text-14-20-regular);color:var(--psi-checkbox-fg)}._disabled_thyza_13{opacity:.4;cursor:not-allowed}._input_thyza_20{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}._indicator_thyza_34{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;flex-shrink:0;border:1px solid var(--psi-checkbox-box-border);border-radius:var(--psi-radius-4);background:var(--psi-checkbox-box-bg);transition:background-color var(--psi-duration-150) var(--psi-ease-standard),border-color var(--psi-duration-150) var(--psi-ease-standard)}._input_thyza_20:checked+._indicator_thyza_34{background:var(--psi-checkbox-box-bg-checked);border-color:var(--psi-checkbox-box-border-checked)}._input_thyza_20:checked+._indicator_thyza_34:after{content:"";display:block;width:4px;height:8px;color:var(--psi-checkbox-check-fg);border:solid currentColor;border-width:0 2px 2px 0;transform:rotate(45deg) translate(-.5px,-.5px)}._input_thyza_20:focus-visible+._indicator_thyza_34{outline:2px solid var(--psi-checkbox-focus-ring);outline-offset:2px}._text_thyza_75{color:var(--psi-checkbox-fg)}._label_jru2c_3{display:inline-flex;align-items:center;gap:var(--psi-space-8);cursor:pointer;-webkit-user-select:none;user-select:none;font:var(--psi-text-14-20-regular);color:var(--psi-switch-fg)}._disabled_jru2c_13{opacity:.4;cursor:not-allowed}._input_jru2c_20{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}._track_jru2c_34{position:relative;display:inline-flex;align-items:center;width:36px;height:20px;flex-shrink:0;border-radius:var(--psi-radius-full);background:var(--psi-switch-track-bg);transition:background-color var(--psi-duration-150) var(--psi-ease-standard)}._input_jru2c_20:checked+._track_jru2c_34{background:var(--psi-switch-track-bg-checked)}._input_jru2c_20:focus-visible+._track_jru2c_34{outline:2px solid var(--psi-switch-focus-ring);outline-offset:2px}._thumb_jru2c_58{position:absolute;width:16px;height:16px;border-radius:var(--psi-radius-full);background:var(--psi-switch-thumb-bg);left:2px;transition:left var(--psi-duration-150) var(--psi-ease-standard);box-shadow:0 1px 2px #00000029}._input_jru2c_20:checked+._track_jru2c_34 ._thumb_jru2c_58{left:18px}._text_jru2c_75{color:var(--psi-switch-fg)}._tag_3oysa_3{display:inline-flex;align-items:center;gap:var(--psi-space-4);height:24px;padding-inline:var(--psi-space-8);border-radius:var(--psi-radius-full);font:var(--psi-text-12-16-medium);white-space:nowrap;-webkit-user-select:none;user-select:none}._dismiss_3oysa_17{display:inline-flex;align-items:center;justify-content:center;padding:0;border:none;background:none;color:inherit;cursor:pointer;opacity:.7;margin-inline-start:var(--psi-space-2);margin-inline-end:calc(-1 * var(--psi-space-4));border-radius:var(--psi-radius-full)}._dismiss_3oysa_17:hover{opacity:1}._dismiss_3oysa_17:focus-visible{outline:2px solid var(--psi-tag-focus-ring);outline-offset:2px}._neutral_3oysa_43{background:var(--psi-tag-neutral-bg);color:var(--psi-tag-neutral-fg)}._accent_3oysa_48{background:var(--psi-tag-accent-bg);color:var(--psi-tag-accent-fg)}._success_3oysa_53{background:var(--psi-tag-success-bg);color:var(--psi-tag-success-fg)}._warning_3oysa_58{background:var(--psi-tag-warning-bg);color:var(--psi-tag-warning-fg)}._danger_3oysa_63{background:var(--psi-tag-danger-bg);color:var(--psi-tag-danger-fg)}._neutralSubtle_3oysa_70{background:var(--psi-tag-neutral-subtle-bg);color:var(--psi-tag-neutral-subtle-fg)}._accentSubtle_3oysa_75{background:var(--psi-tag-accent-subtle-bg);color:var(--psi-tag-accent-subtle-fg)}._successSubtle_3oysa_80{background:var(--psi-tag-success-subtle-bg);color:var(--psi-tag-success-subtle-fg)}._warningSubtle_3oysa_85{background:var(--psi-tag-warning-subtle-bg);color:var(--psi-tag-warning-subtle-fg)}._dangerSubtle_3oysa_90{background:var(--psi-tag-danger-subtle-bg);color:var(--psi-tag-danger-subtle-fg)}._wrapper_17qua_3{position:relative;display:inline-flex}._tooltip_17qua_10{position:absolute;z-index:var(--psi-z-tooltip);padding:var(--psi-space-4) var(--psi-space-8);border-radius:var(--psi-radius-6);background:var(--psi-tooltip-bg);color:var(--psi-tooltip-fg);font:var(--psi-text-12-16-regular);white-space:nowrap;pointer-events:none}._top_17qua_24{bottom:100%;left:50%;transform:translate(-50%);margin-bottom:var(--psi-space-4)}._bottom_17qua_31{top:100%;left:50%;transform:translate(-50%);margin-top:var(--psi-space-4)}._left_17qua_38{right:100%;top:50%;transform:translateY(-50%);margin-right:var(--psi-space-4)}._right_17qua_45{left:100%;top:50%;transform:translateY(-50%);margin-left:var(--psi-space-4)}
|
package/llms.txt
CHANGED
|
@@ -4,6 +4,7 @@
|
|
|
4
4
|
|
|
5
5
|
## Machine-readable artifacts
|
|
6
6
|
- dist/manifest.json: full component/prop inventory with types and defaults
|
|
7
|
+
- dist/patterns.json: 3 composition patterns (D47) — gap-annotated recipes with clarifying parameters; presets are generated JSX, never hand-written
|
|
7
8
|
- docs/{Component}.md: per-component docs (props, theming, variant guidance)
|
|
8
9
|
|
|
9
10
|
## Rules for generated code
|
|
@@ -12,6 +13,7 @@
|
|
|
12
13
|
- size is a px number (24|32|40|48), never "sm"/"md"/"lg".
|
|
13
14
|
- variant vocabulary: accent | accent-subtle | neutral | neutral-subtle | ghost | danger | danger-subtle | outline.
|
|
14
15
|
- One accent per visual group. danger only for destructive actions.
|
|
16
|
+
- Before composing multi-component UI, consult dist/patterns.json (or psi-mcp search) for a matching pattern and honor its clarifying parameters; presets are copy-paste JSX generated from the compose tree.
|
|
15
17
|
|
|
16
18
|
## Button: href + outline (D33/D34)
|
|
17
19
|
- Button renders as an <a> when given `href` (plus optional `target`/`rel`); disabled anchors get aria-disabled, no href attribute, and pointer-events: none instead of the disabled attribute.
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@handamade/psi-react",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.6.0",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"types": "dist/index.d.ts",
|
|
@@ -38,10 +38,10 @@
|
|
|
38
38
|
"tsx": "^4.22.4",
|
|
39
39
|
"vite": "^6.0.0",
|
|
40
40
|
"vitest": "^3.2.6",
|
|
41
|
-
"@handamade/psi-tokens": "0.
|
|
41
|
+
"@handamade/psi-tokens": "0.6.0"
|
|
42
42
|
},
|
|
43
43
|
"scripts": {
|
|
44
|
-
"build": "vite build && tsc -p tsconfig.build.json && tsx scripts/emit-manifest.ts && tsx scripts/emit-docs.ts",
|
|
44
|
+
"build": "vite build && tsc -p tsconfig.build.json && tsx scripts/emit-manifest.ts && tsx scripts/emit-patterns.ts && tsx scripts/emit-docs.ts",
|
|
45
45
|
"dev": "vite build --watch"
|
|
46
46
|
}
|
|
47
47
|
}
|