laif-ds 1.1.1 → 1.1.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/CHANGELOG.md +7 -0
- package/dist/_virtual/index6.js +2 -2
- package/dist/_virtual/index7.js +2 -2
- package/dist/agent-docs/adoption-report.json +2 -2
- package/dist/agent-docs/components/Input.md +11 -10
- package/dist/agent-docs/manifest.json +6 -6
- package/dist/components/ui/app-data-grid/app-data-grid.js +1 -0
- package/dist/components/ui/input.js +63 -62
- package/dist/index.d.ts +6 -0
- package/dist/node_modules/eventemitter3/index2.js +1 -1
- package/dist/node_modules/style-to-object/cjs/index.js +1 -1
- package/package.json +1 -1
package/dist/CHANGELOG.md
CHANGED
|
@@ -5,6 +5,13 @@ All notable technical changes to the laif-ds core will be documented in this fil
|
|
|
5
5
|
The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
|
|
6
6
|
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
|
|
7
7
|
|
|
8
|
+
## [laif-ds@1.1.2]
|
|
9
|
+
|
|
10
|
+
### 🐛 Fixed
|
|
11
|
+
|
|
12
|
+
- **AppDataGrid**: Fixed the toolbar search showing two clear ("×") buttons instead of one
|
|
13
|
+
- **Input**: Added a `clearable` prop (default `true`) to control whether the built-in clear button is shown on `type="search"` inputs
|
|
14
|
+
|
|
8
15
|
## [laif-ds@1.1.1]
|
|
9
16
|
|
|
10
17
|
### 🔧 Changed
|
package/dist/_virtual/index6.js
CHANGED
package/dist/_virtual/index7.js
CHANGED
|
@@ -10,16 +10,17 @@ Text input component with label, sizes, optional left/right icons, custom start/
|
|
|
10
10
|
|
|
11
11
|
Extends native `<input>` props (except `size` and `label` which are redefined).
|
|
12
12
|
|
|
13
|
-
| Prop | Type | Default | Description
|
|
14
|
-
| ---------------- | ----------------- | ---------------- |
|
|
15
|
-
| `label` | `string | React.ReactNode` | `undefined`
|
|
16
|
-
| `labelClassName` | `string` | `""` | Extra classes for the label.
|
|
17
|
-
| `size` | `"sm" | "default" | "lg"`
|
|
18
|
-
| `iconLeft` | `IconName` | `undefined` | Optional left icon (uses `Icon`).
|
|
19
|
-
| `iconRight` | `IconName` | `undefined` | Optional right icon (ignored when `type="password"`).
|
|
20
|
-
| `startContent` | `React.ReactNode` | `undefined` | Custom content before the input (coexists with `iconLeft`).
|
|
21
|
-
| `endContent` | `React.ReactNode` | `undefined` | Custom content after the input (coexists with `iconRight`).
|
|
22
|
-
| `
|
|
13
|
+
| Prop | Type | Default | Description |
|
|
14
|
+
| ---------------- | ----------------- | ---------------- | -------------------------------------------------------------------------------------- | ---------------------------------- | ------------------------------ |
|
|
15
|
+
| `label` | `string | React.ReactNode` | `undefined` | Field label shown above the input. |
|
|
16
|
+
| `labelClassName` | `string` | `""` | Extra classes for the label. |
|
|
17
|
+
| `size` | `"sm" | "default" | "lg"` | `"default"` | Controls height and font-size. |
|
|
18
|
+
| `iconLeft` | `IconName` | `undefined` | Optional left icon (uses `Icon`). |
|
|
19
|
+
| `iconRight` | `IconName` | `undefined` | Optional right icon (ignored when `type="password"`). |
|
|
20
|
+
| `startContent` | `React.ReactNode` | `undefined` | Custom content before the input (coexists with `iconLeft`). |
|
|
21
|
+
| `endContent` | `React.ReactNode` | `undefined` | Custom content after the input (coexists with `iconRight`). |
|
|
22
|
+
| `clearable` | `boolean` | `true` | `type="search"` only: built-in clear «×». Set `false` if `endContent` renders its own. |
|
|
23
|
+
| `errorMessage` | `string` | `undefined` | Custom error message (shown after interaction/invalid state). |
|
|
23
24
|
|
|
24
25
|
All other standard input attributes (e.g., `type`, `placeholder`, `required`, `min`, `max`, `pattern`, etc.) are supported.
|
|
25
26
|
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
{
|
|
2
2
|
"schemaVersion": "1.1.0",
|
|
3
|
-
"generatedAt": "2026-
|
|
3
|
+
"generatedAt": "2026-10-01T10:45:09.928Z",
|
|
4
4
|
"package": {
|
|
5
5
|
"name": "laif-ds",
|
|
6
|
-
"version": "1.1.
|
|
6
|
+
"version": "1.1.2"
|
|
7
7
|
},
|
|
8
8
|
"stats": {
|
|
9
9
|
"documentedComponentCount": 97,
|
|
@@ -3866,10 +3866,10 @@
|
|
|
3866
3866
|
},
|
|
3867
3867
|
"metadata": {
|
|
3868
3868
|
"props": {
|
|
3869
|
-
"totalProps":
|
|
3869
|
+
"totalProps": 9,
|
|
3870
3870
|
"requiredPropsCount": 0,
|
|
3871
|
-
"typedPropsCount":
|
|
3872
|
-
"describedPropsCount":
|
|
3871
|
+
"typedPropsCount": 9,
|
|
3872
|
+
"describedPropsCount": 9
|
|
3873
3873
|
},
|
|
3874
3874
|
"accessibility": {
|
|
3875
3875
|
"hasCoverage": true
|
|
@@ -6536,5 +6536,5 @@
|
|
|
6536
6536
|
]
|
|
6537
6537
|
}
|
|
6538
6538
|
],
|
|
6539
|
-
"checksum": "
|
|
6539
|
+
"checksum": "44236b5c35e1b29867207f25709eff0de16f40df0cfa97d7c9ac682e95f92b33"
|
|
6540
6540
|
}
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsxs as u, jsx as o } from "react/jsx-runtime";
|
|
3
|
-
import { cva as
|
|
3
|
+
import { cva as y } from "../../node_modules/class-variance-authority/dist/index.js";
|
|
4
4
|
import * as a from "react";
|
|
5
5
|
import { designTokens as i } from "../design-tokens.js";
|
|
6
|
-
import { Label as
|
|
7
|
-
import { cn as
|
|
6
|
+
import { Label as le } from "./label.js";
|
|
7
|
+
import { cn as l } from "../../lib/utils.js";
|
|
8
8
|
import { Icon as k } from "./icon.js";
|
|
9
|
-
import { Typo as
|
|
10
|
-
const
|
|
11
|
-
|
|
9
|
+
import { Typo as ce } from "./typo.js";
|
|
10
|
+
const ue = y(
|
|
11
|
+
l(
|
|
12
12
|
i.input.base,
|
|
13
13
|
i.radius.default,
|
|
14
14
|
"items-center gap-2 px-3",
|
|
@@ -27,8 +27,8 @@ const le = G(
|
|
|
27
27
|
size: "default"
|
|
28
28
|
}
|
|
29
29
|
}
|
|
30
|
-
),
|
|
31
|
-
|
|
30
|
+
), de = y(
|
|
31
|
+
l(
|
|
32
32
|
i.text.base,
|
|
33
33
|
"shadow-none flex-1 min-w-0 bg-transparent outline-none border-0 p-0 overflow-hidden text-ellipsis",
|
|
34
34
|
"file:text-d-foreground file:inline-flex file:border-0 file:bg-transparent file:text-sm file:font-medium",
|
|
@@ -50,26 +50,27 @@ const le = G(
|
|
|
50
50
|
size: "default"
|
|
51
51
|
}
|
|
52
52
|
}
|
|
53
|
-
),
|
|
53
|
+
), w = {
|
|
54
54
|
show: "Mostra password",
|
|
55
55
|
hide: "Nascondi password"
|
|
56
|
-
}, T = "Cancella",
|
|
56
|
+
}, T = "Cancella", be = a.forwardRef(
|
|
57
57
|
({
|
|
58
|
-
className:
|
|
58
|
+
className: G,
|
|
59
59
|
type: d,
|
|
60
60
|
label: E,
|
|
61
|
-
labelClassName:
|
|
62
|
-
id:
|
|
61
|
+
labelClassName: F,
|
|
62
|
+
id: X,
|
|
63
63
|
iconLeft: M,
|
|
64
64
|
iconRight: V,
|
|
65
65
|
startContent: C,
|
|
66
66
|
endContent: L,
|
|
67
|
+
clearable: $ = !0,
|
|
67
68
|
size: f,
|
|
68
|
-
disabled:
|
|
69
|
+
disabled: c,
|
|
69
70
|
required: O,
|
|
70
71
|
onBlur: _,
|
|
71
|
-
onChange:
|
|
72
|
-
onInvalid:
|
|
72
|
+
onChange: B,
|
|
73
|
+
onInvalid: z,
|
|
73
74
|
"aria-invalid": J,
|
|
74
75
|
"aria-describedby": K,
|
|
75
76
|
showValidMessage: D = !1,
|
|
@@ -77,19 +78,19 @@ const le = G(
|
|
|
77
78
|
validityI18n: t,
|
|
78
79
|
...m
|
|
79
80
|
}, Q) => {
|
|
80
|
-
const [p, Y] = a.useState(!1), [
|
|
81
|
+
const [p, Y] = a.useState(!1), [x, N] = a.useState(!0), [Z, R] = a.useState(!1), [U, S] = a.useState(""), q = a.useId(), b = X ?? q, j = `${b}-validity`, h = a.useRef(null), v = d === "password", I = d === "search", [ee, W] = a.useState(
|
|
81
82
|
() => String(m.value ?? m.defaultValue ?? "").length > 0
|
|
82
|
-
), I = v ? p ? "text" : "password" : d,
|
|
83
|
+
), H = I && $ && ee && !c, te = v ? p ? "text" : "password" : d, P = J ?? (!x && Z ? !0 : void 0), se = [K, A && j].filter(Boolean).join(" ").trim() || void 0;
|
|
83
84
|
a.useImperativeHandle(Q, () => h.current);
|
|
84
|
-
const
|
|
85
|
+
const ae = a.useCallback(
|
|
85
86
|
(e) => {
|
|
86
|
-
if (
|
|
87
|
+
if (c) return;
|
|
87
88
|
const s = e.target;
|
|
88
89
|
if (s.tagName === "INPUT" || s.tagName === "BUTTON") return;
|
|
89
90
|
const r = h.current;
|
|
90
91
|
r && (r.focus(), !v && d !== "file" && r.select());
|
|
91
92
|
},
|
|
92
|
-
[
|
|
93
|
+
[c, v, d]
|
|
93
94
|
), g = a.useCallback(
|
|
94
95
|
(e) => {
|
|
95
96
|
const s = e.validity, r = e.validationMessage !== "" ? e.validationMessage : "✓";
|
|
@@ -111,51 +112,51 @@ const le = G(
|
|
|
111
112
|
N(e), S(s);
|
|
112
113
|
}
|
|
113
114
|
}, [g]);
|
|
114
|
-
const
|
|
115
|
+
const re = a.useCallback(
|
|
115
116
|
(e) => {
|
|
116
117
|
R(!0);
|
|
117
118
|
const { isValid: s, message: r } = g(e.currentTarget);
|
|
118
|
-
N(s), S(r),
|
|
119
|
+
N(s), S(r), W(e.currentTarget.value.length > 0), B?.(e);
|
|
119
120
|
},
|
|
120
|
-
[
|
|
121
|
+
[B, g]
|
|
121
122
|
);
|
|
122
123
|
a.useEffect(() => {
|
|
123
|
-
m.value !== void 0 &&
|
|
124
|
+
m.value !== void 0 && W(String(m.value).length > 0);
|
|
124
125
|
}, [m.value]);
|
|
125
|
-
const
|
|
126
|
+
const ne = a.useCallback(() => {
|
|
126
127
|
const e = h.current;
|
|
127
128
|
if (!e) return;
|
|
128
129
|
Object.getOwnPropertyDescriptor(
|
|
129
130
|
window.HTMLInputElement.prototype,
|
|
130
131
|
"value"
|
|
131
132
|
)?.set?.call(e, ""), e.dispatchEvent(new Event("input", { bubbles: !0 })), e.focus();
|
|
132
|
-
}, []),
|
|
133
|
+
}, []), oe = a.useCallback(
|
|
133
134
|
(e) => {
|
|
134
135
|
R(!0), _?.(e);
|
|
135
136
|
},
|
|
136
137
|
[_]
|
|
137
|
-
),
|
|
138
|
+
), ie = a.useCallback(
|
|
138
139
|
(e) => {
|
|
139
140
|
const { isValid: s, message: r } = g(e.currentTarget);
|
|
140
|
-
N(s), S(r),
|
|
141
|
+
N(s), S(r), z?.(e);
|
|
141
142
|
},
|
|
142
|
-
[
|
|
143
|
+
[z, g]
|
|
143
144
|
);
|
|
144
|
-
return /* @__PURE__ */ u("div", { className:
|
|
145
|
-
E && /* @__PURE__ */ u(
|
|
145
|
+
return /* @__PURE__ */ u("div", { className: l("flex flex-col gap-1.5", G), children: [
|
|
146
|
+
E && /* @__PURE__ */ u(le, { htmlFor: b, className: l("gap-0.5", F), children: [
|
|
146
147
|
E,
|
|
147
|
-
O &&
|
|
148
|
-
!
|
|
148
|
+
O && x && /* @__PURE__ */ o("div", { children: "*" }),
|
|
149
|
+
!x && /* @__PURE__ */ o("div", { className: "text-d-destructive", children: "*" })
|
|
149
150
|
] }),
|
|
150
151
|
/* @__PURE__ */ u(
|
|
151
152
|
"div",
|
|
152
153
|
{
|
|
153
|
-
className:
|
|
154
|
-
|
|
155
|
-
|
|
154
|
+
className: l(
|
|
155
|
+
ue({ size: f }),
|
|
156
|
+
c ? "cursor-not-allowed opacity-50" : "cursor-text"
|
|
156
157
|
),
|
|
157
|
-
"aria-invalid":
|
|
158
|
-
onClick:
|
|
158
|
+
"aria-invalid": P,
|
|
159
|
+
onClick: ae,
|
|
159
160
|
children: [
|
|
160
161
|
(M || C) && /* @__PURE__ */ u("div", { className: "text-d-muted-foreground flex shrink-0 items-center gap-2", children: [
|
|
161
162
|
M && /* @__PURE__ */ o(k, { name: M, size: f === "lg" ? "sm" : "xs" }),
|
|
@@ -165,16 +166,16 @@ const le = G(
|
|
|
165
166
|
"input",
|
|
166
167
|
{
|
|
167
168
|
id: b,
|
|
168
|
-
type:
|
|
169
|
+
type: te,
|
|
169
170
|
"data-slot": "input",
|
|
170
|
-
className:
|
|
171
|
+
className: l(de({ size: f })),
|
|
171
172
|
ref: h,
|
|
172
|
-
disabled:
|
|
173
|
-
onChange:
|
|
174
|
-
onBlur:
|
|
175
|
-
onInvalid:
|
|
176
|
-
"aria-invalid":
|
|
177
|
-
"aria-describedby":
|
|
173
|
+
disabled: c,
|
|
174
|
+
onChange: re,
|
|
175
|
+
onBlur: oe,
|
|
176
|
+
onInvalid: ie,
|
|
177
|
+
"aria-invalid": P,
|
|
178
|
+
"aria-describedby": se,
|
|
178
179
|
required: O,
|
|
179
180
|
step: d === "number" ? "any" : void 0,
|
|
180
181
|
...m
|
|
@@ -187,15 +188,15 @@ const le = G(
|
|
|
187
188
|
onClick: (e) => {
|
|
188
189
|
e.stopPropagation(), e.preventDefault(), Y((s) => !s);
|
|
189
190
|
},
|
|
190
|
-
className:
|
|
191
|
+
className: l(
|
|
191
192
|
"text-d-muted-foreground flex shrink-0 cursor-pointer items-center",
|
|
192
|
-
|
|
193
|
+
c && "cursor-not-allowed"
|
|
193
194
|
),
|
|
194
|
-
"aria-label": p ?
|
|
195
|
+
"aria-label": p ? w.hide : w.show,
|
|
195
196
|
"aria-pressed": p,
|
|
196
197
|
"aria-controls": b,
|
|
197
|
-
title: p ?
|
|
198
|
-
disabled:
|
|
198
|
+
title: p ? w.hide : w.show,
|
|
199
|
+
disabled: c,
|
|
199
200
|
children: [
|
|
200
201
|
/* @__PURE__ */ o(
|
|
201
202
|
k,
|
|
@@ -204,17 +205,17 @@ const le = G(
|
|
|
204
205
|
size: f === "lg" ? "sm" : "xs"
|
|
205
206
|
}
|
|
206
207
|
),
|
|
207
|
-
/* @__PURE__ */ o("span", { className: "sr-only", children: p ?
|
|
208
|
+
/* @__PURE__ */ o("span", { className: "sr-only", children: p ? w.hide : w.show })
|
|
208
209
|
]
|
|
209
210
|
}
|
|
210
|
-
) : (
|
|
211
|
+
) : (H || V || L) && /* @__PURE__ */ u("div", { className: "text-d-muted-foreground flex shrink-0 items-center gap-2", children: [
|
|
211
212
|
L,
|
|
212
|
-
|
|
213
|
+
H && /* @__PURE__ */ u(
|
|
213
214
|
"button",
|
|
214
215
|
{
|
|
215
216
|
type: "button",
|
|
216
217
|
onClick: (e) => {
|
|
217
|
-
e.stopPropagation(), e.preventDefault(),
|
|
218
|
+
e.stopPropagation(), e.preventDefault(), ne();
|
|
218
219
|
},
|
|
219
220
|
onMouseDown: (e) => e.preventDefault(),
|
|
220
221
|
className: "text-d-muted-foreground flex shrink-0 cursor-pointer items-center",
|
|
@@ -232,15 +233,15 @@ const le = G(
|
|
|
232
233
|
}
|
|
233
234
|
),
|
|
234
235
|
A && U.length > 0 && /* @__PURE__ */ o(
|
|
235
|
-
|
|
236
|
+
ce,
|
|
236
237
|
{
|
|
237
238
|
variant: "caption",
|
|
238
239
|
id: j,
|
|
239
|
-
role:
|
|
240
|
+
role: x ? "status" : "alert",
|
|
240
241
|
"aria-live": "polite",
|
|
241
|
-
className:
|
|
242
|
+
className: l(
|
|
242
243
|
"max-w-full min-w-0 text-wrap",
|
|
243
|
-
|
|
244
|
+
x ? "text-d-success" : "text-d-destructive"
|
|
244
245
|
),
|
|
245
246
|
children: U
|
|
246
247
|
}
|
|
@@ -249,6 +250,6 @@ const le = G(
|
|
|
249
250
|
}
|
|
250
251
|
);
|
|
251
252
|
export {
|
|
252
|
-
|
|
253
|
-
|
|
253
|
+
be as Input,
|
|
254
|
+
de as inputVariants
|
|
254
255
|
};
|
package/dist/index.d.ts
CHANGED
|
@@ -8071,6 +8071,12 @@ export declare interface InputProps extends Omit<React_2.ComponentProps<"input">
|
|
|
8071
8071
|
iconRight?: IconName;
|
|
8072
8072
|
startContent?: React_2.ReactNode;
|
|
8073
8073
|
endContent?: React_2.ReactNode;
|
|
8074
|
+
/**
|
|
8075
|
+
* Only for `type="search"`: renders the built-in clear «×» when the field has
|
|
8076
|
+
* a value. Pass `false` when the caller renders its own clear control in
|
|
8077
|
+
* `endContent`, otherwise the field shows two «×».
|
|
8078
|
+
*/
|
|
8079
|
+
clearable?: boolean;
|
|
8074
8080
|
validityI18n?: InputValidityI18n;
|
|
8075
8081
|
showValidMessage?: boolean;
|
|
8076
8082
|
showValidityMessage?: boolean;
|