@studiolxd/brand 39.0.0 → 40.1.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/CHANGELOG.md +107 -0
- package/dist/_shared/brandmessagescontext.js +15 -0
- package/dist/_shared/calendargrid.js +42 -42
- package/dist/_shared/datepicker.js +41 -41
- package/dist/_shared/imagecropdialog.js +54 -54
- package/dist/_shared/tokens.js +1 -0
- package/dist/_types/messages/BrandMessages.d.ts +26 -0
- package/dist/_types/messages/BrandMessagesContext.d.ts +21 -0
- package/dist/_types/messages/BrandMessagesProvider.d.ts +46 -0
- package/dist/_types/messages/index.d.ts +5 -0
- package/dist/_types/molecules/Pagination/Pagination.d.ts +40 -23
- package/dist/_types/organisms/AnnotationThread/AnnotationThread.d.ts +27 -5
- package/dist/_types/organisms/DataTable/DataTable.d.ts +3 -2
- package/dist/accordion.js +26 -26
- package/dist/alert.js +26 -26
- package/dist/annotation-thread.css +1 -1
- package/dist/annotation-thread.js +37 -26
- package/dist/app-header.js +8 -8
- package/dist/app-launcher.js +34 -34
- package/dist/app-shell.js +14 -14
- package/dist/assistant-message.js +8 -8
- package/dist/async-multi-select-field.js +9 -9
- package/dist/async-multi-select.js +40 -40
- package/dist/async-select-field.js +9 -9
- package/dist/async-select.js +64 -64
- package/dist/avatar-upload.js +40 -40
- package/dist/avatar.js +5 -5
- package/dist/banner.js +9 -9
- package/dist/brand.css +2 -1
- package/dist/button.js +7 -7
- package/dist/calendar-planner.js +16 -16
- package/dist/calendar.js +38 -38
- package/dist/card.js +28 -28
- package/dist/carousel.js +19 -19
- package/dist/chart.js +137 -137
- package/dist/chat-shell.js +23 -23
- package/dist/checkbox-field.js +11 -11
- package/dist/checkbox.js +7 -7
- package/dist/close-button.js +6 -6
- package/dist/code-block.js +15 -15
- package/dist/code.js +5 -5
- package/dist/collapsible.js +1 -1
- package/dist/columns.js +7 -7
- package/dist/command-palette.js +14 -14
- package/dist/confirm-dialog.js +10 -10
- package/dist/connector-auth-shell.js +9 -9
- package/dist/consent.js +23 -23
- package/dist/container.js +6 -6
- package/dist/conversation-list.js +19 -19
- package/dist/conversation-thread.js +15 -15
- package/dist/copy-button.js +9 -9
- package/dist/copyable-value.js +17 -17
- package/dist/data-table.js +29 -29
- package/dist/date-picker-field.js +9 -9
- package/dist/date-time-field.js +12 -12
- package/dist/description-list.js +12 -12
- package/dist/docs-search.js +1 -1
- package/dist/dots-button.js +7 -7
- package/dist/dropdown-field.js +13 -13
- package/dist/email.js +44 -44
- package/dist/error-text.js +4 -4
- package/dist/field-row.js +20 -20
- package/dist/figure.js +8 -8
- package/dist/file-upload-field.js +9 -9
- package/dist/file-upload.js +29 -29
- package/dist/filter-bar.js +10 -10
- package/dist/floating-dock.js +17 -17
- package/dist/form-field.js +43 -43
- package/dist/form.js +14 -14
- package/dist/heading.js +5 -5
- package/dist/input-field.js +20 -20
- package/dist/input-phone-field.js +9 -9
- package/dist/input-phone.js +19 -19
- package/dist/input.js +5 -5
- package/dist/kbd.js +5 -5
- package/dist/label.js +5 -5
- package/dist/link.js +7 -7
- package/dist/list.js +7 -7
- package/dist/menu-button.js +7 -7
- package/dist/message-bubble.js +5 -5
- package/dist/message-composer.js +13 -13
- package/dist/messages.js +12 -0
- package/dist/multi-select-field.js +9 -9
- package/dist/multi-select.js +52 -52
- package/dist/notification-button.js +8 -8
- package/dist/notification-panel.js +25 -25
- package/dist/number-input-field.js +9 -9
- package/dist/number-input.js +11 -11
- package/dist/otp-field.js +9 -9
- package/dist/otp-input.js +48 -48
- package/dist/pagination.js +92 -89
- package/dist/paragraph.js +5 -5
- package/dist/password-field.js +15 -15
- package/dist/prose.js +4 -4
- package/dist/public-page-shell.js +11 -11
- package/dist/radio-field.js +11 -11
- package/dist/radio-group.js +5 -5
- package/dist/radio.js +5 -5
- package/dist/scroll-area.js +11 -11
- package/dist/search-form.js +8 -8
- package/dist/select-field.js +9 -9
- package/dist/select.js +85 -85
- package/dist/separator.js +6 -6
- package/dist/sidebar.js +16 -16
- package/dist/site-header.js +14 -14
- package/dist/site-shell.js +6 -6
- package/dist/sparkline.js +9 -9
- package/dist/star-rating.js +24 -24
- package/dist/stat-tile.js +12 -12
- package/dist/steps.js +32 -32
- package/dist/switcher-field.js +13 -13
- package/dist/switcher.js +8 -8
- package/dist/table-of-contents.js +14 -14
- package/dist/tag.js +5 -5
- package/dist/text.js +7 -7
- package/dist/textarea-field.js +11 -11
- package/dist/textarea.js +5 -5
- package/dist/time-field.js +9 -9
- package/dist/time-select.js +17 -17
- package/dist/toaster.js +16 -16
- package/dist/toggle-group.js +7 -7
- package/dist/toggle.js +5 -5
- package/dist/tokens.css +2 -1
- package/dist/tooltip.js +16 -16
- package/dist/tree-view.js +41 -41
- package/dist/uptime-bars.js +34 -34
- package/dist/user-message.js +8 -8
- package/dist/visually-hidden.js +5 -5
- package/package.json +5 -1
- package/src/tokens/molecules/annotation-thread.css +1 -0
- package/src/tokens/scss/molecules/_annotation-thread.scss +1 -0
- package/src/tokens/tokens.json +1 -0
package/dist/consent.js
CHANGED
|
@@ -8,44 +8,44 @@ import { Paragraph as i } from "./paragraph.js";
|
|
|
8
8
|
import { SwitcherField as a } from "./switcher-field.js";
|
|
9
9
|
import { Sheet as o } from "./sheet.js";
|
|
10
10
|
import { Modal as s } from "./modal.js";
|
|
11
|
-
import {
|
|
12
|
-
import {
|
|
11
|
+
import { useEffect as c, useState as l } from "react";
|
|
12
|
+
import { Fragment as u, jsx as d, jsxs as f } from "react/jsx-runtime";
|
|
13
13
|
//#region src/stories/molecules/Consent/Consent.tsx
|
|
14
|
-
function p({ open: e = !0, onAcceptAll: a, onRejectAll: o, onOpenPreferences: s, title:
|
|
15
|
-
return e ? /* @__PURE__ */
|
|
14
|
+
function p({ open: e = !0, onAcceptAll: a, onRejectAll: o, onOpenPreferences: s, title: c = "Cookies", description: l = "Usamos cookies propias y de terceros para que el sitio funcione y para entender cómo se usa. Puedes aceptarlas todas, rechazarlas o elegir por categorías.", policyHref: p, policyLabel: m = "Política de cookies", policyExternal: h = !1, acceptAllLabel: g = "Aceptar todas", rejectAllLabel: _ = "Rechazar", preferencesLabel: v = "Preferencias", regionLabel: y = "Consentimiento de cookies", className: b, ...x }) {
|
|
15
|
+
return e ? /* @__PURE__ */ d("aside", {
|
|
16
16
|
className: ["consent-banner", b].filter(Boolean).join(" "),
|
|
17
17
|
role: "region",
|
|
18
18
|
"aria-label": y,
|
|
19
19
|
...x,
|
|
20
|
-
children: /* @__PURE__ */
|
|
20
|
+
children: /* @__PURE__ */ f("div", {
|
|
21
21
|
className: "consent-banner__inner",
|
|
22
|
-
children: [/* @__PURE__ */
|
|
22
|
+
children: [/* @__PURE__ */ f("div", {
|
|
23
23
|
className: "consent-banner__text",
|
|
24
|
-
children: [/* @__PURE__ */
|
|
24
|
+
children: [/* @__PURE__ */ d(n, {
|
|
25
25
|
level: 2,
|
|
26
26
|
size: 3,
|
|
27
27
|
className: "consent-banner__title",
|
|
28
|
-
children:
|
|
29
|
-
}), /* @__PURE__ */
|
|
28
|
+
children: c
|
|
29
|
+
}), /* @__PURE__ */ f(i, {
|
|
30
30
|
className: "consent-banner__description",
|
|
31
|
-
children: [
|
|
31
|
+
children: [l, p !== void 0 && /* @__PURE__ */ f(u, { children: [" ", /* @__PURE__ */ d(r, {
|
|
32
32
|
href: p,
|
|
33
33
|
external: h,
|
|
34
34
|
children: m
|
|
35
35
|
})] })]
|
|
36
36
|
})]
|
|
37
|
-
}), /* @__PURE__ */
|
|
37
|
+
}), /* @__PURE__ */ f("div", {
|
|
38
38
|
className: "consent-banner__actions",
|
|
39
39
|
children: [
|
|
40
|
-
/* @__PURE__ */
|
|
40
|
+
/* @__PURE__ */ d(t, {
|
|
41
41
|
onClick: a,
|
|
42
42
|
children: g
|
|
43
43
|
}),
|
|
44
|
-
/* @__PURE__ */
|
|
44
|
+
/* @__PURE__ */ d(t, {
|
|
45
45
|
onClick: o,
|
|
46
46
|
children: _
|
|
47
47
|
}),
|
|
48
|
-
s && /* @__PURE__ */
|
|
48
|
+
s && /* @__PURE__ */ d(t, {
|
|
49
49
|
variant: "outline",
|
|
50
50
|
onClick: s,
|
|
51
51
|
children: v
|
|
@@ -61,8 +61,8 @@ function m(e, t) {
|
|
|
61
61
|
return n;
|
|
62
62
|
}
|
|
63
63
|
function h({ open: t, onOpenChange: n, categories: r, value: i, onChange: p, onSave: h, surface: g = "modal", side: _ = "right", title: v = "Preferencias de cookies", closeLabel: y = "Cerrar", alwaysOnLabel: b = "Siempre activa", container: x, className: S }) {
|
|
64
|
-
let C = p !== void 0, [w, T] =
|
|
65
|
-
|
|
64
|
+
let C = p !== void 0, [w, T] = l(() => m(i, r));
|
|
65
|
+
c(() => {
|
|
66
66
|
t && !C && T(m(i, r));
|
|
67
67
|
}, [t, C]);
|
|
68
68
|
let E = C ? m(i, r) : w, D = (e) => {
|
|
@@ -72,14 +72,14 @@ function h({ open: t, onOpenChange: n, categories: r, value: i, onChange: p, onS
|
|
|
72
72
|
...E,
|
|
73
73
|
[e]: t
|
|
74
74
|
});
|
|
75
|
-
}, k = /* @__PURE__ */
|
|
75
|
+
}, k = /* @__PURE__ */ d("div", {
|
|
76
76
|
className: ["consent-preferences", S].filter(Boolean).join(" "),
|
|
77
|
-
children: /* @__PURE__ */
|
|
77
|
+
children: /* @__PURE__ */ d("ul", {
|
|
78
78
|
className: "consent-preferences__list",
|
|
79
|
-
children: r.map((t) => /* @__PURE__ */
|
|
79
|
+
children: r.map((t) => /* @__PURE__ */ d("li", {
|
|
80
80
|
className: "consent-preferences__category",
|
|
81
|
-
children: /* @__PURE__ */
|
|
82
|
-
label: t.required ? /* @__PURE__ */ u
|
|
81
|
+
children: /* @__PURE__ */ d(a, {
|
|
82
|
+
label: t.required ? /* @__PURE__ */ f(u, { children: [t.name, /* @__PURE__ */ d(e, { children: `, ${b}` })] }) : t.name,
|
|
83
83
|
helperText: t.description,
|
|
84
84
|
checked: t.required ? !0 : E[t.id] === !0,
|
|
85
85
|
disabled: t.required,
|
|
@@ -88,14 +88,14 @@ function h({ open: t, onOpenChange: n, categories: r, value: i, onChange: p, onS
|
|
|
88
88
|
}, t.id))
|
|
89
89
|
})
|
|
90
90
|
});
|
|
91
|
-
return g === "modal" ? /* @__PURE__ */
|
|
91
|
+
return g === "modal" ? /* @__PURE__ */ d(s, {
|
|
92
92
|
open: t,
|
|
93
93
|
onClose: () => n(!1),
|
|
94
94
|
title: typeof v == "string" ? v : void 0,
|
|
95
95
|
closeLabel: y,
|
|
96
96
|
container: x,
|
|
97
97
|
children: k
|
|
98
|
-
}) : /* @__PURE__ */
|
|
98
|
+
}) : /* @__PURE__ */ d(o, {
|
|
99
99
|
open: t,
|
|
100
100
|
onOpenChange: n,
|
|
101
101
|
side: _,
|
package/dist/container.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import './container.css';
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
2
|
+
import { forwardRef as e } from "react";
|
|
3
|
+
import { jsx as t } from "react/jsx-runtime";
|
|
4
4
|
//#region src/stories/atoms/Container/Container.tsx
|
|
5
|
-
var n =
|
|
5
|
+
var n = e(function({ width: e = "xl", space: n = "none", flush: r = !1, surface: i, as: a = "div", className: o, innerClassName: s, children: c, ...l }, u) {
|
|
6
6
|
let d = [
|
|
7
7
|
"container",
|
|
8
8
|
n !== "none" && `container--space-${n}`,
|
|
@@ -11,14 +11,14 @@ var n = t(function({ width: t = "xl", space: n = "none", flush: r = !1, surface:
|
|
|
11
11
|
o
|
|
12
12
|
].filter(Boolean).join(" "), f = [
|
|
13
13
|
"container__inner",
|
|
14
|
-
|
|
14
|
+
e !== "full" && `container__inner--${e}`,
|
|
15
15
|
s
|
|
16
16
|
].filter(Boolean).join(" ");
|
|
17
|
-
return /* @__PURE__ */
|
|
17
|
+
return /* @__PURE__ */ t(a, {
|
|
18
18
|
ref: u,
|
|
19
19
|
className: d,
|
|
20
20
|
...l,
|
|
21
|
-
children: /* @__PURE__ */
|
|
21
|
+
children: /* @__PURE__ */ t("div", {
|
|
22
22
|
className: f,
|
|
23
23
|
children: c
|
|
24
24
|
})
|
|
@@ -6,54 +6,54 @@ import { Skeleton as n } from "./skeleton.js";
|
|
|
6
6
|
import { Tooltip as r } from "./tooltip.js";
|
|
7
7
|
import { Alert as i } from "./alert.js";
|
|
8
8
|
import { EmptyState as a } from "./empty-state.js";
|
|
9
|
-
import {
|
|
10
|
-
import {
|
|
9
|
+
import { forwardRef as o, useState as s } from "react";
|
|
10
|
+
import { jsx as c, jsxs as l } from "react/jsx-runtime";
|
|
11
11
|
//#region src/stories/molecules/ConversationList/ConversationList.tsx
|
|
12
12
|
function u(e) {
|
|
13
13
|
return e.scrollWidth > e.clientWidth + 1;
|
|
14
14
|
}
|
|
15
|
-
var d =
|
|
16
|
-
let [E, D] =
|
|
17
|
-
return /* @__PURE__ */
|
|
15
|
+
var d = o(function({ conversations: o, activeId: d, onNew: f, onSelect: p, onDelete: m, newLabel: h = "Nueva conversación", navLabel: g = "Conversaciones", deleteLabel: _ = (e) => `Eliminar conversación "${e}"`, isLoading: v = !1, loadingCount: y = 4, error: b, emptyMessage: x = "Todavía no hay conversaciones", errorTitle: S = "No se pudieron cargar las conversaciones", className: C, ...w }, T) {
|
|
16
|
+
let [E, D] = s(null), O = b === void 0 ? v ? "loading" : o.length === 0 ? "empty" : "list" : "error";
|
|
17
|
+
return /* @__PURE__ */ l("div", {
|
|
18
18
|
ref: T,
|
|
19
19
|
className: `conversation-list${C ? ` ${C}` : ""}`,
|
|
20
20
|
...w,
|
|
21
|
-
children: [/* @__PURE__ */
|
|
21
|
+
children: [/* @__PURE__ */ c("div", {
|
|
22
22
|
className: "conversation-list__header",
|
|
23
|
-
children: /* @__PURE__ */
|
|
23
|
+
children: /* @__PURE__ */ c(t, {
|
|
24
24
|
variant: "outline",
|
|
25
25
|
block: !0,
|
|
26
26
|
onClick: f,
|
|
27
27
|
children: h
|
|
28
28
|
})
|
|
29
|
-
}), /* @__PURE__ */
|
|
29
|
+
}), /* @__PURE__ */ l("nav", {
|
|
30
30
|
"aria-label": g,
|
|
31
31
|
className: "conversation-list__nav",
|
|
32
32
|
"aria-busy": v || void 0,
|
|
33
33
|
children: [
|
|
34
|
-
O === "error" && /* @__PURE__ */
|
|
34
|
+
O === "error" && /* @__PURE__ */ c(i, {
|
|
35
35
|
variant: "error",
|
|
36
36
|
title: S,
|
|
37
37
|
description: b,
|
|
38
38
|
className: "conversation-list__state"
|
|
39
39
|
}),
|
|
40
|
-
O === "loading" && /* @__PURE__ */
|
|
40
|
+
O === "loading" && /* @__PURE__ */ c("div", {
|
|
41
41
|
className: "conversation-list__loading",
|
|
42
|
-
children: Array.from({ length: y }, (e, t) => /* @__PURE__ */
|
|
42
|
+
children: Array.from({ length: y }, (e, t) => /* @__PURE__ */ c(n, {}, t))
|
|
43
43
|
}),
|
|
44
|
-
O === "empty" && /* @__PURE__ */
|
|
44
|
+
O === "empty" && /* @__PURE__ */ c(a, {
|
|
45
45
|
size: "sm",
|
|
46
46
|
title: x,
|
|
47
47
|
className: "conversation-list__state"
|
|
48
48
|
}),
|
|
49
|
-
O === "list" && /* @__PURE__ */
|
|
49
|
+
O === "list" && /* @__PURE__ */ c("ul", {
|
|
50
50
|
className: "conversation-list__items",
|
|
51
51
|
role: "list",
|
|
52
|
-
children:
|
|
52
|
+
children: o.map((n) => {
|
|
53
53
|
let i = n.id === d;
|
|
54
|
-
return /* @__PURE__ */
|
|
54
|
+
return /* @__PURE__ */ l("li", {
|
|
55
55
|
className: "conversation-list__item",
|
|
56
|
-
children: [/* @__PURE__ */
|
|
56
|
+
children: [/* @__PURE__ */ c(r, {
|
|
57
57
|
label: n.label,
|
|
58
58
|
describe: !1,
|
|
59
59
|
open: E === n.id,
|
|
@@ -68,14 +68,14 @@ var d = c(function({ conversations: c, activeId: d, onNew: f, onSelect: p, onDel
|
|
|
68
68
|
u(e.currentTarget) && D(n.id);
|
|
69
69
|
},
|
|
70
70
|
onBlur: () => D(null),
|
|
71
|
-
children: /* @__PURE__ */
|
|
71
|
+
children: /* @__PURE__ */ c("button", {
|
|
72
72
|
type: "button",
|
|
73
73
|
className: `conversation-list__label${i ? " conversation-list__label--active" : ""}`,
|
|
74
74
|
"aria-current": i ? "page" : void 0,
|
|
75
75
|
onClick: () => p(n.id),
|
|
76
76
|
children: n.label
|
|
77
77
|
})
|
|
78
|
-
}), /* @__PURE__ */
|
|
78
|
+
}), /* @__PURE__ */ c(t, {
|
|
79
79
|
variant: "ghost",
|
|
80
80
|
size: "sm",
|
|
81
81
|
iconOnly: !0,
|
|
@@ -84,7 +84,7 @@ var d = c(function({ conversations: c, activeId: d, onNew: f, onSelect: p, onDel
|
|
|
84
84
|
onClick: (e) => {
|
|
85
85
|
e.stopPropagation(), m(n.id);
|
|
86
86
|
},
|
|
87
|
-
children: /* @__PURE__ */
|
|
87
|
+
children: /* @__PURE__ */ c(e, {
|
|
88
88
|
name: "close",
|
|
89
89
|
size: "sm"
|
|
90
90
|
})
|
|
@@ -2,37 +2,37 @@
|
|
|
2
2
|
import './conversation-thread.css';
|
|
3
3
|
import { UserMessage as e } from "./user-message.js";
|
|
4
4
|
import { AssistantMessage as t } from "./assistant-message.js";
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
5
|
+
import { forwardRef as n, useEffect as r, useRef as i } from "react";
|
|
6
|
+
import { jsx as a, jsxs as o } from "react/jsx-runtime";
|
|
7
7
|
//#region src/stories/organisms/ConversationThread/ConversationThread.tsx
|
|
8
8
|
function s() {
|
|
9
9
|
return typeof window > "u" || typeof window.matchMedia != "function" || window.matchMedia("(prefers-reduced-motion: reduce)").matches ? "auto" : "smooth";
|
|
10
10
|
}
|
|
11
|
-
var c =
|
|
12
|
-
let g =
|
|
13
|
-
return
|
|
11
|
+
var c = n(function({ messages: n = [], children: c, streamingLabel: l, ariaLabel: u = "Conversación", locale: d, timestampFormat: f, className: p, ...m }, h) {
|
|
12
|
+
let g = i(null);
|
|
13
|
+
return r(() => {
|
|
14
14
|
g.current?.scrollIntoView({ behavior: s() });
|
|
15
|
-
}, [
|
|
15
|
+
}, [n, c]), /* @__PURE__ */ o("div", {
|
|
16
16
|
ref: h,
|
|
17
17
|
className: `conversation-thread${p ? ` ${p}` : ""}`,
|
|
18
18
|
role: "log",
|
|
19
19
|
"aria-label": u,
|
|
20
20
|
"data-content": c == null ? "messages" : "children",
|
|
21
21
|
...m,
|
|
22
|
-
children: [c ??
|
|
23
|
-
timestamp:
|
|
22
|
+
children: [c ?? n.map((n) => n.role === "user" ? /* @__PURE__ */ a(e, {
|
|
23
|
+
timestamp: n.timestamp,
|
|
24
24
|
locale: d,
|
|
25
25
|
timestampFormat: f,
|
|
26
|
-
children:
|
|
27
|
-
},
|
|
28
|
-
model:
|
|
29
|
-
timestamp:
|
|
26
|
+
children: n.content
|
|
27
|
+
}, n.id) : /* @__PURE__ */ a(t, {
|
|
28
|
+
model: n.model,
|
|
29
|
+
timestamp: n.timestamp,
|
|
30
30
|
locale: d,
|
|
31
31
|
timestampFormat: f,
|
|
32
|
-
isStreaming:
|
|
32
|
+
isStreaming: n.isStreaming,
|
|
33
33
|
streamingLabel: l,
|
|
34
|
-
children:
|
|
35
|
-
},
|
|
34
|
+
children: n.content
|
|
35
|
+
}, n.id)), /* @__PURE__ */ a("div", {
|
|
36
36
|
ref: g,
|
|
37
37
|
"aria-hidden": "true"
|
|
38
38
|
})]
|
package/dist/copy-button.js
CHANGED
|
@@ -4,15 +4,15 @@ import { Icon as e } from "./icon.js";
|
|
|
4
4
|
import { VisuallyHidden as t } from "./visually-hidden.js";
|
|
5
5
|
import { Button as n } from "./button.js";
|
|
6
6
|
import { n as r, t as i } from "./_shared/copy-to-clipboard.js";
|
|
7
|
-
import {
|
|
8
|
-
import {
|
|
7
|
+
import { forwardRef as a } from "react";
|
|
8
|
+
import { Fragment as o, jsx as s, jsxs as c } from "react/jsx-runtime";
|
|
9
9
|
//#region src/stories/molecules/CopyButton/CopyButton.tsx
|
|
10
|
-
var l =
|
|
10
|
+
var l = a(function({ value: a, children: l, label: u = "Copiar", copiedLabel: d = "Copiado", errorLabel: f = "No se pudo copiar", variant: p = "ghost", size: m, feedbackDuration: h = i, onCopy: g, onCopyError: _, className: v, ...y }, b) {
|
|
11
11
|
let { status: x, copy: S } = r(h), C = async () => {
|
|
12
|
-
let e = await S(
|
|
12
|
+
let e = await S(a);
|
|
13
13
|
e.ok ? g?.(e.text) : _?.(e.error);
|
|
14
14
|
}, w = x === "copied" ? d : x === "error" ? f : "", T = l == null ? null : x === "copied" ? d : x === "error" ? f : l;
|
|
15
|
-
return /* @__PURE__ */
|
|
15
|
+
return /* @__PURE__ */ c(o, { children: [l == null ? /* @__PURE__ */ s(n, {
|
|
16
16
|
...y,
|
|
17
17
|
ref: b,
|
|
18
18
|
variant: p,
|
|
@@ -21,22 +21,22 @@ var l = c(function({ value: c, children: l, label: u = "Copiar", copiedLabel: d
|
|
|
21
21
|
"aria-label": u,
|
|
22
22
|
onClick: C,
|
|
23
23
|
className: ["copy-button", v].filter(Boolean).join(" "),
|
|
24
|
-
children: /* @__PURE__ */
|
|
24
|
+
children: /* @__PURE__ */ s(e, {
|
|
25
25
|
name: x === "copied" ? "check" : "copy",
|
|
26
26
|
size: "sm"
|
|
27
27
|
})
|
|
28
|
-
}) : /* @__PURE__ */
|
|
28
|
+
}) : /* @__PURE__ */ c(n, {
|
|
29
29
|
...y,
|
|
30
30
|
ref: b,
|
|
31
31
|
variant: p,
|
|
32
32
|
...m ? { size: m } : {},
|
|
33
33
|
onClick: C,
|
|
34
34
|
className: ["copy-button", v].filter(Boolean).join(" "),
|
|
35
|
-
children: [/* @__PURE__ */
|
|
35
|
+
children: [/* @__PURE__ */ s(e, {
|
|
36
36
|
name: x === "copied" ? "check" : "copy",
|
|
37
37
|
size: "sm"
|
|
38
38
|
}), T]
|
|
39
|
-
}), /* @__PURE__ */
|
|
39
|
+
}), /* @__PURE__ */ s(t, {
|
|
40
40
|
role: "status",
|
|
41
41
|
children: w
|
|
42
42
|
})] });
|
package/dist/copyable-value.js
CHANGED
|
@@ -4,8 +4,8 @@ import { Icon as e } from "./icon.js";
|
|
|
4
4
|
import { VisuallyHidden as t } from "./visually-hidden.js";
|
|
5
5
|
import { Button as n } from "./button.js";
|
|
6
6
|
import { n as r } from "./_shared/copy-to-clipboard.js";
|
|
7
|
-
import {
|
|
8
|
-
import {
|
|
7
|
+
import { forwardRef as i, isValidElement as a } from "react";
|
|
8
|
+
import { Fragment as o, jsx as s, jsxs as c } from "react/jsx-runtime";
|
|
9
9
|
//#region src/stories/atoms/CopyableValue/CopyableValue.tsx
|
|
10
10
|
var l = 6, u = 12, d = new Set([
|
|
11
11
|
"/",
|
|
@@ -41,26 +41,26 @@ function p(e) {
|
|
|
41
41
|
}
|
|
42
42
|
return t;
|
|
43
43
|
}
|
|
44
|
-
return
|
|
44
|
+
return a(e) ? p(e.props.children) : null;
|
|
45
45
|
}
|
|
46
|
-
var m = 24, h =
|
|
47
|
-
let { status: g, copy: _ } = r(), v = g === "copied", y = ["copyable-value", d].filter(Boolean).join(" "), b = typeof
|
|
46
|
+
var m = 24, h = i(function({ children: i, copyText: a, copyLabel: l = "Copiar", copiedLabel: u = "Copiado", className: d }, h) {
|
|
47
|
+
let { status: g, copy: _ } = r(), v = g === "copied", y = ["copyable-value", d].filter(Boolean).join(" "), b = typeof i == "string", x = b ? f(i) : null, S = b ? null : p(i), C = b ? i : S ?? "", w = !b && S !== null && !/\s/.test(S) && S.length <= m, T = /* @__PURE__ */ s(n, {
|
|
48
48
|
iconOnly: !0,
|
|
49
49
|
variant: "ghost",
|
|
50
50
|
size: "sm",
|
|
51
51
|
"aria-label": l,
|
|
52
|
-
onClick: () => _(() =>
|
|
52
|
+
onClick: () => _(() => a ?? C),
|
|
53
53
|
className: "copyable-value__copy",
|
|
54
|
-
children: /* @__PURE__ */
|
|
54
|
+
children: /* @__PURE__ */ s(e, {
|
|
55
55
|
name: v ? "check" : "copy",
|
|
56
56
|
size: "sm"
|
|
57
57
|
})
|
|
58
58
|
}), E;
|
|
59
59
|
if (b) {
|
|
60
60
|
let { head: e, tail: t } = x;
|
|
61
|
-
E = /* @__PURE__ */
|
|
61
|
+
E = /* @__PURE__ */ c("span", {
|
|
62
62
|
className: "copyable-value__value",
|
|
63
|
-
children: [e, /* @__PURE__ */
|
|
63
|
+
children: [e, /* @__PURE__ */ c("span", {
|
|
64
64
|
className: "copyable-value__tail",
|
|
65
65
|
children: [
|
|
66
66
|
t,
|
|
@@ -69,28 +69,28 @@ var m = 24, h = s(function({ children: s, copyText: c, copyLabel: l = "Copiar",
|
|
|
69
69
|
]
|
|
70
70
|
})]
|
|
71
71
|
});
|
|
72
|
-
} else E = w ? /* @__PURE__ */
|
|
72
|
+
} else E = w ? /* @__PURE__ */ c("span", {
|
|
73
73
|
className: "copyable-value__tail",
|
|
74
74
|
children: [
|
|
75
|
-
/* @__PURE__ */
|
|
75
|
+
/* @__PURE__ */ s("span", {
|
|
76
76
|
className: "copyable-value__value",
|
|
77
|
-
children:
|
|
77
|
+
children: i
|
|
78
78
|
}),
|
|
79
79
|
"",
|
|
80
80
|
T
|
|
81
81
|
]
|
|
82
|
-
}) : /* @__PURE__ */ o
|
|
83
|
-
/* @__PURE__ */
|
|
82
|
+
}) : /* @__PURE__ */ c(o, { children: [
|
|
83
|
+
/* @__PURE__ */ s("span", {
|
|
84
84
|
className: "copyable-value__value",
|
|
85
|
-
children:
|
|
85
|
+
children: i
|
|
86
86
|
}),
|
|
87
87
|
"",
|
|
88
88
|
T
|
|
89
89
|
] });
|
|
90
|
-
return /* @__PURE__ */
|
|
90
|
+
return /* @__PURE__ */ c("span", {
|
|
91
91
|
ref: h,
|
|
92
92
|
className: y,
|
|
93
|
-
children: [E, /* @__PURE__ */
|
|
93
|
+
children: [E, /* @__PURE__ */ s(t, {
|
|
94
94
|
role: "status",
|
|
95
95
|
children: v ? u : ""
|
|
96
96
|
})]
|
package/dist/data-table.js
CHANGED
|
@@ -6,9 +6,9 @@ import { Pagination as n } from "./pagination.js";
|
|
|
6
6
|
import { Table as r, TableBody as i, TableCell as a, TableHead as o, TableHeader as s, TableRow as c } from "./table.js";
|
|
7
7
|
import { InputField as l } from "./input-field.js";
|
|
8
8
|
import { EmptyState as u } from "./empty-state.js";
|
|
9
|
-
import
|
|
10
|
-
import
|
|
11
|
-
import {
|
|
9
|
+
import * as d from "react";
|
|
10
|
+
import { useId as f, useState as p } from "react";
|
|
11
|
+
import { jsx as m, jsxs as h } from "react/jsx-runtime";
|
|
12
12
|
//#region node_modules/.pnpm/@tanstack+table-core@8.21.3/node_modules/@tanstack/table-core/build/lib/index.mjs
|
|
13
13
|
function g(e, t) {
|
|
14
14
|
return typeof e == "function" ? e(t) : e;
|
|
@@ -1526,7 +1526,7 @@ function ze() {
|
|
|
1526
1526
|
//#endregion
|
|
1527
1527
|
//#region node_modules/.pnpm/@tanstack+react-table@8.21.3_react-dom@19.2.4_react@19.2.4__react@19.2.4/node_modules/@tanstack/react-table/build/lib/index.mjs
|
|
1528
1528
|
function Be(e, t) {
|
|
1529
|
-
return e ? Ve(e) ? /* @__PURE__ */
|
|
1529
|
+
return e ? Ve(e) ? /* @__PURE__ */ d.createElement(e, t) : e : null;
|
|
1530
1530
|
}
|
|
1531
1531
|
function Ve(e) {
|
|
1532
1532
|
return He(e) || typeof e == "function" || Ue(e);
|
|
@@ -1546,7 +1546,7 @@ function We(e) {
|
|
|
1546
1546
|
onStateChange: () => {},
|
|
1547
1547
|
renderFallbackValue: null,
|
|
1548
1548
|
...e
|
|
1549
|
-
}, [n] =
|
|
1549
|
+
}, [n] = d.useState(() => ({ current: je(t) })), [r, i] = d.useState(() => n.current.initialState);
|
|
1550
1550
|
return n.current.setOptions((t) => ({
|
|
1551
1551
|
...t,
|
|
1552
1552
|
...e,
|
|
@@ -1565,11 +1565,11 @@ function Ge(e, t) {
|
|
|
1565
1565
|
let n = t.columnDef.meta?.align;
|
|
1566
1566
|
return n && n !== "start" ? `data-table__${e}--${n}` : "";
|
|
1567
1567
|
}
|
|
1568
|
-
function Ke({ columns:
|
|
1568
|
+
function Ke({ columns: d, data: g, ariaLabel: _, ariaLabelledBy: v, searchColumnId: y, search: b, searchPlaceholder: x, searchClearLabel: S, toolbar: C, footerActions: ee, pageSize: w = 10, emptyMessage: T = "Sin resultados", isLoading: te, pagination: E, headerLabels: D, paginationLabels: O, className: k }) {
|
|
1569
1569
|
"use no memo";
|
|
1570
|
-
let [A, j] =
|
|
1570
|
+
let [A, j] = p([]), [M, N] = p([]), P = We({
|
|
1571
1571
|
data: g,
|
|
1572
|
-
columns:
|
|
1572
|
+
columns: d,
|
|
1573
1573
|
state: {
|
|
1574
1574
|
sorting: A,
|
|
1575
1575
|
columnFilters: M
|
|
@@ -1583,13 +1583,13 @@ function Ke({ columns: p, data: g, ariaLabel: _, ariaLabelledBy: v, searchColumn
|
|
|
1583
1583
|
getPaginationRowModel: Re(),
|
|
1584
1584
|
initialState: { pagination: { pageSize: w } }
|
|
1585
1585
|
}
|
|
1586
|
-
}), ne = E?.pageSize ?? w, F = x ?? "Buscar", I = `${
|
|
1587
|
-
return /* @__PURE__ */
|
|
1586
|
+
}), ne = E?.pageSize ?? w, F = x ?? "Buscar", I = `${f()}-search`;
|
|
1587
|
+
return /* @__PURE__ */ h("div", {
|
|
1588
1588
|
className: ["data-table", k].filter(Boolean).join(" "),
|
|
1589
1589
|
children: [
|
|
1590
|
-
(y || b || C) && /* @__PURE__ */
|
|
1590
|
+
(y || b || C) && /* @__PURE__ */ h("div", {
|
|
1591
1591
|
className: "data-table__toolbar",
|
|
1592
|
-
children: [b ? /* @__PURE__ */
|
|
1592
|
+
children: [b ? /* @__PURE__ */ m(l, {
|
|
1593
1593
|
className: "data-table__search",
|
|
1594
1594
|
id: I,
|
|
1595
1595
|
kind: "search",
|
|
@@ -1599,7 +1599,7 @@ function Ke({ columns: p, data: g, ariaLabel: _, ariaLabelledBy: v, searchColumn
|
|
|
1599
1599
|
...S ? { clearLabel: S } : {},
|
|
1600
1600
|
value: b.value,
|
|
1601
1601
|
onChange: (e) => b.onChange(e.target.value)
|
|
1602
|
-
}) : y && /* @__PURE__ */
|
|
1602
|
+
}) : y && /* @__PURE__ */ m(l, {
|
|
1603
1603
|
className: "data-table__search",
|
|
1604
1604
|
id: I,
|
|
1605
1605
|
kind: "search",
|
|
@@ -1609,40 +1609,40 @@ function Ke({ columns: p, data: g, ariaLabel: _, ariaLabelledBy: v, searchColumn
|
|
|
1609
1609
|
...S ? { clearLabel: S } : {},
|
|
1610
1610
|
value: P.getColumn(y)?.getFilterValue() ?? "",
|
|
1611
1611
|
onChange: (e) => P.getColumn(y)?.setFilterValue(e.target.value)
|
|
1612
|
-
}), C && /* @__PURE__ */
|
|
1612
|
+
}), C && /* @__PURE__ */ m("div", {
|
|
1613
1613
|
className: "data-table__toolbar-actions",
|
|
1614
1614
|
children: C
|
|
1615
1615
|
})]
|
|
1616
1616
|
}),
|
|
1617
|
-
/* @__PURE__ */
|
|
1617
|
+
/* @__PURE__ */ m("div", {
|
|
1618
1618
|
className: "data-table__scroll",
|
|
1619
|
-
children: /* @__PURE__ */
|
|
1619
|
+
children: /* @__PURE__ */ h(r, {
|
|
1620
1620
|
"aria-label": _,
|
|
1621
1621
|
"aria-labelledby": v,
|
|
1622
1622
|
"aria-busy": te || void 0,
|
|
1623
|
-
children: [/* @__PURE__ */
|
|
1623
|
+
children: [/* @__PURE__ */ m(o, { children: P.getHeaderGroups().map((t) => /* @__PURE__ */ m(c, { children: t.headers.map((t) => {
|
|
1624
1624
|
let n = t.column.getIsSorted(), r = t.column.getCanSort(), i = Ge("header-cell", t.column), a = t.column.columnDef.meta?.headerHidden === !0, o = t.isPlaceholder ? null : Be(t.column.columnDef.header, t.getContext());
|
|
1625
|
-
return /* @__PURE__ */
|
|
1625
|
+
return /* @__PURE__ */ m(s, {
|
|
1626
1626
|
className: ["data-table__header-cell", i].filter(Boolean).join(" "),
|
|
1627
1627
|
sortable: r,
|
|
1628
1628
|
sorted: n === "asc" || n === "desc" ? n : !1,
|
|
1629
1629
|
onSort: r ? () => t.column.toggleSorting() : void 0,
|
|
1630
1630
|
sticky: t.column.columnDef.meta?.sticky,
|
|
1631
1631
|
...D,
|
|
1632
|
-
children: a ? /* @__PURE__ */
|
|
1632
|
+
children: a ? /* @__PURE__ */ m(e, { children: o }) : o
|
|
1633
1633
|
}, t.id);
|
|
1634
|
-
}) }, t.id)) }), /* @__PURE__ */
|
|
1634
|
+
}) }, t.id)) }), /* @__PURE__ */ m(i, { children: te ? Array.from({ length: ne }).map((e, n) => /* @__PURE__ */ m(c, {
|
|
1635
1635
|
"aria-hidden": "true",
|
|
1636
|
-
children:
|
|
1637
|
-
}, n)) : P.getRowModel().rows.length === 0 ? /* @__PURE__ */
|
|
1638
|
-
colSpan:
|
|
1639
|
-
children: /* @__PURE__ */
|
|
1636
|
+
children: d.map((e, n) => /* @__PURE__ */ m(a, { children: /* @__PURE__ */ m(t, {}) }, n))
|
|
1637
|
+
}, n)) : P.getRowModel().rows.length === 0 ? /* @__PURE__ */ m(c, { children: /* @__PURE__ */ m(a, {
|
|
1638
|
+
colSpan: d.length,
|
|
1639
|
+
children: /* @__PURE__ */ m(u, {
|
|
1640
1640
|
size: "sm",
|
|
1641
1641
|
title: T
|
|
1642
1642
|
})
|
|
1643
|
-
}) }) : P.getRowModel().rows.map((e) => /* @__PURE__ */
|
|
1643
|
+
}) }) : P.getRowModel().rows.map((e) => /* @__PURE__ */ m(c, {
|
|
1644
1644
|
selected: e.getIsSelected(),
|
|
1645
|
-
children: e.getVisibleCells().map((e) => /* @__PURE__ */
|
|
1645
|
+
children: e.getVisibleCells().map((e) => /* @__PURE__ */ m(a, {
|
|
1646
1646
|
className: ["data-table__cell", Ge("cell", e.column)].filter(Boolean).join(" "),
|
|
1647
1647
|
sticky: e.column.columnDef.meta?.sticky,
|
|
1648
1648
|
children: Be(e.column.columnDef.cell, e.getContext())
|
|
@@ -1650,9 +1650,9 @@ function Ke({ columns: p, data: g, ariaLabel: _, ariaLabelledBy: v, searchColumn
|
|
|
1650
1650
|
}, e.id)) })]
|
|
1651
1651
|
})
|
|
1652
1652
|
}),
|
|
1653
|
-
/* @__PURE__ */
|
|
1653
|
+
/* @__PURE__ */ m("div", {
|
|
1654
1654
|
className: "data-table__footer",
|
|
1655
|
-
children: E ? /* @__PURE__ */
|
|
1655
|
+
children: E ? /* @__PURE__ */ m(n, {
|
|
1656
1656
|
total: E.total,
|
|
1657
1657
|
page: E.page,
|
|
1658
1658
|
pageSize: E.pageSize,
|
|
@@ -1661,7 +1661,7 @@ function Ke({ columns: p, data: g, ariaLabel: _, ariaLabelledBy: v, searchColumn
|
|
|
1661
1661
|
showTotal: !0,
|
|
1662
1662
|
afterPageSize: ee,
|
|
1663
1663
|
...O
|
|
1664
|
-
}) : /* @__PURE__ */
|
|
1664
|
+
}) : /* @__PURE__ */ m(n, {
|
|
1665
1665
|
total: P.getFilteredRowModel().rows.length,
|
|
1666
1666
|
page: P.getState().pagination.pageIndex + 1,
|
|
1667
1667
|
pageSize: P.getState().pagination.pageSize,
|
|
@@ -5,21 +5,21 @@ import { ErrorText as t } from "./error-text.js";
|
|
|
5
5
|
import { Label as n } from "./label.js";
|
|
6
6
|
import { n as r } from "./_shared/field-labels.js";
|
|
7
7
|
import { t as i } from "./_shared/datepicker.js";
|
|
8
|
-
import {
|
|
9
|
-
import {
|
|
8
|
+
import { forwardRef as a, useId as o } from "react";
|
|
9
|
+
import { jsx as s, jsxs as c } from "react/jsx-runtime";
|
|
10
10
|
//#region src/stories/molecules/DatePickerField/DatePickerField.tsx
|
|
11
|
-
var l =
|
|
12
|
-
let v = r(u), y = e(m), b =
|
|
13
|
-
return /* @__PURE__ */
|
|
11
|
+
var l = a(function({ id: a, label: l, labelHidden: u, errorMessage: d, helperText: f, error: p = !1, size: m, className: h, ...g }, _) {
|
|
12
|
+
let v = r(u), y = e(m), b = o(), x = a ?? b, S = d ? `${x}-error` : void 0, C = f ? `${x}-helper` : void 0, w = [S, C].filter(Boolean).join(" ") || void 0, T = p || !!d;
|
|
13
|
+
return /* @__PURE__ */ c("div", {
|
|
14
14
|
className: ["date-picker-field", h].filter(Boolean).join(" "),
|
|
15
15
|
children: [
|
|
16
|
-
/* @__PURE__ */
|
|
16
|
+
/* @__PURE__ */ s(n, {
|
|
17
17
|
htmlFor: x,
|
|
18
18
|
hidden: v,
|
|
19
19
|
size: y,
|
|
20
20
|
children: l
|
|
21
21
|
}),
|
|
22
|
-
/* @__PURE__ */
|
|
22
|
+
/* @__PURE__ */ s(i, {
|
|
23
23
|
calendarLabel: l,
|
|
24
24
|
...g,
|
|
25
25
|
ref: _,
|
|
@@ -28,11 +28,11 @@ var l = s(function({ id: s, label: l, labelHidden: u, errorMessage: d, helperTex
|
|
|
28
28
|
error: T,
|
|
29
29
|
"aria-describedby": w
|
|
30
30
|
}),
|
|
31
|
-
d && /* @__PURE__ */
|
|
31
|
+
d && /* @__PURE__ */ s(t, {
|
|
32
32
|
id: S,
|
|
33
33
|
children: d
|
|
34
34
|
}),
|
|
35
|
-
f && /* @__PURE__ */
|
|
35
|
+
f && /* @__PURE__ */ s("span", {
|
|
36
36
|
id: C,
|
|
37
37
|
className: "date-picker-field__helper",
|
|
38
38
|
children: f
|