@cognite/aura 0.3.2 → 0.3.3

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.
Files changed (108) hide show
  1. package/DESIGN.md +134 -5
  2. package/README.md +24 -3
  3. package/dist/components/index.d.ts +2 -0
  4. package/dist/components/index.js +58 -327
  5. package/dist/components/ui/core/accordion/accordion.js +79 -114
  6. package/dist/components/ui/core/action-toolbar/action-toolbar.js +108 -176
  7. package/dist/components/ui/core/alert/alert.js +158 -206
  8. package/dist/components/ui/core/avatar/avatar.js +64 -90
  9. package/dist/components/ui/core/badge/badge.js +73 -108
  10. package/dist/components/ui/core/banner/banner.js +146 -215
  11. package/dist/components/ui/core/breadcrumb/breadcrumb.js +105 -200
  12. package/dist/components/ui/core/button/button.js +47 -52
  13. package/dist/components/ui/core/button-group/button-group.js +40 -79
  14. package/dist/components/ui/core/card/card.js +102 -185
  15. package/dist/components/ui/core/chart/chart.js +116 -206
  16. package/dist/components/ui/core/chart/index.js +2 -8
  17. package/dist/components/ui/core/checkbox/checkbox.js +67 -132
  18. package/dist/components/ui/core/checkbox/checkbox.metadata.js +7 -7
  19. package/dist/components/ui/core/code-block/code-block.d.ts +1 -1
  20. package/dist/components/ui/core/code-block/code-block.js +179 -267
  21. package/dist/components/ui/core/collapsible/collapsible.js +29 -49
  22. package/dist/components/ui/core/combobox/combobox.js +41 -0
  23. package/dist/components/ui/core/command/command.js +85 -150
  24. package/dist/components/ui/core/count/count.js +21 -32
  25. package/dist/components/ui/core/date-time-pickers/date-picker/date-picker.js +60 -72
  26. package/dist/components/ui/core/date-time-pickers/date-picker/use-date-picker.js +36 -51
  27. package/dist/components/ui/core/date-time-pickers/date-range-picker/date-range-picker.js +63 -87
  28. package/dist/components/ui/core/date-time-pickers/date-range-picker/use-date-range-picker.js +60 -68
  29. package/dist/components/ui/core/date-time-pickers/date-time-range-picker/date-time-range-picker.js +118 -174
  30. package/dist/components/ui/core/date-time-pickers/date-time-range-picker/use-date-time-range-picker.js +104 -145
  31. package/dist/components/ui/core/date-time-pickers/index.js +5 -10
  32. package/dist/components/ui/core/date-time-pickers/shared/am-pm-scroll/am-pm-scroll.js +42 -56
  33. package/dist/components/ui/core/date-time-pickers/shared/calendar/calendar.js +66 -117
  34. package/dist/components/ui/core/date-time-pickers/shared/calendar-header/calendar-header.js +63 -93
  35. package/dist/components/ui/core/date-time-pickers/shared/date-time-input/date-time-input.js +64 -98
  36. package/dist/components/ui/core/date-time-pickers/shared/date-time-input/range-input-display.js +38 -67
  37. package/dist/components/ui/core/date-time-pickers/shared/hooks/use-popover-state.js +23 -23
  38. package/dist/components/ui/core/date-time-pickers/shared/hooks/use-range-date-state.js +52 -62
  39. package/dist/components/ui/core/date-time-pickers/shared/hooks/use-range-step-manager.js +18 -18
  40. package/dist/components/ui/core/date-time-pickers/shared/hooks/use-single-date-state.js +24 -31
  41. package/dist/components/ui/core/date-time-pickers/shared/hooks/use-time-state.js +24 -33
  42. package/dist/components/ui/core/date-time-pickers/shared/scroll-cell-classes.js +4 -7
  43. package/dist/components/ui/core/date-time-pickers/shared/shortcuts-panel/shortcuts-panel.js +17 -31
  44. package/dist/components/ui/core/date-time-pickers/shared/time-picker-panel/time-picker-panel.js +40 -40
  45. package/dist/components/ui/core/date-time-pickers/shared/time-picker-scroll/time-picker-scroll.js +33 -50
  46. package/dist/components/ui/core/date-time-pickers/time-picker/time-picker.js +78 -99
  47. package/dist/components/ui/core/date-time-pickers/time-picker/use-time-picker.js +41 -63
  48. package/dist/components/ui/core/date-time-pickers/utils/calendar-utils.js +39 -52
  49. package/dist/components/ui/core/date-time-pickers/utils/time-utils.js +7 -15
  50. package/dist/components/ui/core/dialog/dialog.js +82 -155
  51. package/dist/components/ui/core/dropdown-menu/dropdown-menu.d.ts +2 -2
  52. package/dist/components/ui/core/dropdown-menu/dropdown-menu.js +150 -248
  53. package/dist/components/ui/core/empty-state/empty-state.context.js +5 -8
  54. package/dist/components/ui/core/empty-state/empty-state.js +86 -138
  55. package/dist/components/ui/core/helper-text/helper-text.js +37 -65
  56. package/dist/components/ui/core/hover-card/hover-card.js +54 -80
  57. package/dist/components/ui/core/inline-citation/inline-citation.js +98 -181
  58. package/dist/components/ui/core/input/input.js +12 -27
  59. package/dist/components/ui/core/input-group/input-group.js +76 -173
  60. package/dist/components/ui/core/kbd/kbd.js +20 -36
  61. package/dist/components/ui/core/label/label.js +26 -43
  62. package/dist/components/ui/core/loader/loader.js +80 -117
  63. package/dist/components/ui/core/message/message-response-default-streamdown-controls.js +12 -12
  64. package/dist/components/ui/core/message/message.d.ts +2 -2
  65. package/dist/components/ui/core/message/message.js +316 -542
  66. package/dist/components/ui/core/pagination/pagination-size-context.js +5 -6
  67. package/dist/components/ui/core/pagination/pagination-teleport.js +86 -106
  68. package/dist/components/ui/core/pagination/pagination-teleport.utils.js +6 -6
  69. package/dist/components/ui/core/pagination/pagination.js +231 -334
  70. package/dist/components/ui/core/popover/popover.js +90 -157
  71. package/dist/components/ui/core/progress/progress.js +36 -61
  72. package/dist/components/ui/core/prompt-input/prompt-input.js +274 -413
  73. package/dist/components/ui/core/radio-group/radio-group.js +58 -113
  74. package/dist/components/ui/core/reasoning/reasoning.js +55 -86
  75. package/dist/components/ui/core/scroll-area/scroll-area.js +41 -71
  76. package/dist/components/ui/core/search/search.js +77 -99
  77. package/dist/components/ui/core/segmented-control/segmented-control.js +110 -167
  78. package/dist/components/ui/core/select/select.js +168 -293
  79. package/dist/components/ui/core/separator/separator.js +13 -23
  80. package/dist/components/ui/core/shimmer/shimmer.d.ts +2 -4
  81. package/dist/components/ui/core/shimmer/shimmer.js +40 -107
  82. package/dist/components/ui/core/skeleton/skeleton.js +13 -18
  83. package/dist/components/ui/core/sonner-toast/sonner-toast.js +54 -47
  84. package/dist/components/ui/core/sources/sources.d.ts +5 -1
  85. package/dist/components/ui/core/sources/sources.js +58 -79
  86. package/dist/components/ui/core/switch/switch.js +62 -0
  87. package/dist/components/ui/core/tabs/tabs.js +149 -223
  88. package/dist/components/ui/core/tabs/tabs.utils.js +6 -8
  89. package/dist/components/ui/core/textarea/textarea.js +13 -27
  90. package/dist/components/ui/core/toggle/toggle.js +55 -74
  91. package/dist/components/ui/core/tool/tool.js +127 -163
  92. package/dist/components/ui/core/tooltip/tooltip.js +47 -86
  93. package/dist/components/ui/core/topbar/topbar.js +106 -190
  94. package/dist/eslint/index.js +5 -10
  95. package/dist/eslint/no-overriding-styles.js +178 -237
  96. package/dist/icons/index.d.ts +1 -0
  97. package/dist/icons/index.js +1 -0
  98. package/dist/lib/highlight-code.d.ts +9 -0
  99. package/dist/lib/highlight-code.js +42 -0
  100. package/dist/lib/portal-container-context.js +8 -9
  101. package/dist/lib/style-scope.js +6 -6
  102. package/dist/lib/use-controllable-state.js +21 -30
  103. package/dist/lib/utils.d.ts +0 -2
  104. package/dist/lib/utils.js +32 -112
  105. package/dist/styles.css +1 -1
  106. package/dist/styles.source.css +23 -0
  107. package/package.json +23 -7
  108. package/dist/components/ui/core/date-time-pickers/shared/constants.js +0 -14
@@ -1,113 +1,58 @@
1
- import { jsx as a } from "react/jsx-runtime";
2
- import { forwardRef as t } from "react";
3
- import { Radio as s } from "@base-ui/react/radio";
4
- import { RadioGroup as n } from "@base-ui/react/radio-group";
5
- import { cva as u } from "class-variance-authority";
6
- import { cn as d, selectionItemBase as b, selectionItemCard as l, selectionItemDefault as c, focusState as p, selectionItemLabel as f, selectionItemDescription as g } from "../../../../lib/utils.js";
7
- const m = t(
8
- ({ className: r, orientation: e = "vertical", ...o }, i) => /* @__PURE__ */ a(
9
- n,
10
- {
11
- ref: i,
12
- "data-slot": "radio-group",
13
- "data-orientation": e,
14
- "aria-orientation": e,
15
- className: d(
16
- e === "horizontal" ? "flex items-center gap-2" : "grid has-[[data-variant=card]]:gap-2",
17
- r
18
- ),
19
- ...o
20
- }
21
- )
22
- );
23
- m.displayName = "RadioGroup";
24
- const h = u(d("group/radio-group-item", b), {
25
- variants: {
26
- variant: {
27
- default: c,
28
- card: l
29
- }
30
- },
31
- defaultVariants: {
32
- variant: "default"
33
- }
34
- }), v = t(
35
- ({ className: r, variant: e, ...o }, i) => /* @__PURE__ */ a(
36
- "label",
37
- {
38
- ref: i,
39
- "data-slot": "radio-group-item",
40
- "data-variant": e ?? "default",
41
- className: d(h({ variant: e }), r),
42
- ...o
43
- }
44
- )
45
- );
46
- v.displayName = "RadioGroupItem";
47
- const I = t(({ className: r, ...e }, o) => /* @__PURE__ */ a(
48
- s.Root,
49
- {
50
- ref: o,
51
- "data-slot": "radio-group-item-control",
52
- className: d(
53
- "group relative flex size-4 shrink-0 items-center justify-center rounded-full bg-transparent outline-none before:pointer-events-none before:absolute before:inset-0 before:z-0 before:box-border before:rounded-full before:border-[1.5px] before:border-muted-foreground before:bg-transparent before:transition-[background-color,border-color,box-shadow] before:content-['']",
54
- "data-[checked]:before:border-border-active",
55
- "hover:before:border-secondary-foreground group-hover/radio-group-item:before:border-secondary-foreground",
56
- "data-[checked]:hover:before:border-border-active data-[checked]:hover:before:bg-accent-background",
57
- "data-[checked]:group-hover/radio-group-item:before:border-border-active data-[checked]:group-hover/radio-group-item:before:bg-accent-background",
58
- "data-[disabled]:before:border-disabled-foreground data-[disabled]:before:bg-disabled-background data-[disabled]:hover:before:border-disabled-foreground data-[disabled]:group-hover/radio-group-item:before:border-disabled-foreground data-[disabled]:group-hover/radio-group-item:before:bg-disabled-background",
59
- p,
60
- r
61
- ),
62
- ...e,
63
- children: /* @__PURE__ */ a(
64
- s.Indicator,
65
- {
66
- "data-slot": "radio-group-item-indicator",
67
- className: "relative z-10 flex items-center justify-center size-full",
68
- children: /* @__PURE__ */ a("span", { className: "size-2.5 rounded-full bg-active-background group-hover:bg-active-background-hover group-data-[disabled]:bg-disabled-foreground" })
69
- }
70
- )
71
- }
72
- ));
73
- I.displayName = "RadioGroupItemControl";
74
- const R = t(
75
- ({ className: r, ...e }, o) => /* @__PURE__ */ a(
76
- "span",
77
- {
78
- ref: o,
79
- "data-slot": "radio-group-item-label",
80
- className: d(
81
- f,
82
- "group-has-[[data-checked]]/radio-group-item:text-foreground",
83
- "group-has-[[data-disabled]]/radio-group-item:text-disabled-foreground",
84
- r
85
- ),
86
- ...e
87
- }
88
- )
89
- );
90
- R.displayName = "RadioGroupItemLabel";
91
- const k = t(
92
- ({ className: r, ...e }, o) => /* @__PURE__ */ a(
93
- "span",
94
- {
95
- ref: o,
96
- "data-slot": "radio-group-item-description",
97
- className: d(
98
- g,
99
- "group-has-[[data-disabled]]/radio-group-item:text-disabled-foreground",
100
- r
101
- ),
102
- ...e
103
- }
104
- )
105
- );
106
- k.displayName = "RadioGroupItemDescription";
107
- export {
108
- m as RadioGroup,
109
- v as RadioGroupItem,
110
- I as RadioGroupItemControl,
111
- k as RadioGroupItemDescription,
112
- R as RadioGroupItemLabel
113
- };
1
+ import { cn as e, focusState as t, selectionItemBase as n, selectionItemCard as r, selectionItemDefault as i, selectionItemDescription as a, selectionItemLabel as o } from "../../../../lib/utils.js";
2
+ import { forwardRef as s } from "react";
3
+ import { jsx as c } from "react/jsx-runtime";
4
+ import { cva as l } from "class-variance-authority";
5
+ import { Radio as u } from "@base-ui/react/radio";
6
+ import { RadioGroup as d } from "@base-ui/react/radio-group";
7
+ //#region libs/aura/src/components/ui/core/radio-group/radio-group.tsx
8
+ var f = s(({ className: t, orientation: n = "vertical", ...r }, i) => /* @__PURE__ */ c(d, {
9
+ ref: i,
10
+ "data-slot": "radio-group",
11
+ "data-orientation": n,
12
+ "aria-orientation": n,
13
+ className: e(n === "horizontal" ? "flex items-center gap-2" : "grid has-[[data-variant=card]]:gap-2", t),
14
+ ...r
15
+ }));
16
+ f.displayName = "RadioGroup";
17
+ var p = l(e("group/radio-group-item", n), {
18
+ variants: { variant: {
19
+ default: i,
20
+ card: r
21
+ } },
22
+ defaultVariants: { variant: "default" }
23
+ }), m = s(({ className: t, variant: n, ...r }, i) => /* @__PURE__ */ c("label", {
24
+ ref: i,
25
+ "data-slot": "radio-group-item",
26
+ "data-variant": n ?? "default",
27
+ className: e(p({ variant: n }), t),
28
+ ...r
29
+ }));
30
+ m.displayName = "RadioGroupItem";
31
+ var h = s(({ className: n, ...r }, i) => /* @__PURE__ */ c(u.Root, {
32
+ ref: i,
33
+ "data-slot": "radio-group-item-control",
34
+ className: e("group relative flex size-4 shrink-0 items-center justify-center rounded-full bg-transparent outline-none before:pointer-events-none before:absolute before:inset-0 before:z-0 before:box-border before:rounded-full before:border-[1.5px] before:border-muted-foreground before:bg-transparent before:transition-[background-color,border-color,box-shadow] before:content-['']", "data-[checked]:before:border-border-active", "hover:before:border-secondary-foreground group-hover/radio-group-item:before:border-secondary-foreground", "data-[checked]:hover:before:border-border-active data-[checked]:hover:before:bg-accent-background", "data-[checked]:group-hover/radio-group-item:before:border-border-active data-[checked]:group-hover/radio-group-item:before:bg-accent-background", "data-[disabled]:before:border-disabled-foreground data-[disabled]:before:bg-disabled-background data-[disabled]:hover:before:border-disabled-foreground data-[disabled]:group-hover/radio-group-item:before:border-disabled-foreground data-[disabled]:group-hover/radio-group-item:before:bg-disabled-background", t, n),
35
+ ...r,
36
+ children: /* @__PURE__ */ c(u.Indicator, {
37
+ "data-slot": "radio-group-item-indicator",
38
+ className: "relative z-10 flex items-center justify-center size-full",
39
+ children: /* @__PURE__ */ c("span", { className: "size-2.5 rounded-full bg-active-background group-hover:bg-active-background-hover group-data-[disabled]:bg-disabled-foreground" })
40
+ })
41
+ }));
42
+ h.displayName = "RadioGroupItemControl";
43
+ var g = s(({ className: t, ...n }, r) => /* @__PURE__ */ c("span", {
44
+ ref: r,
45
+ "data-slot": "radio-group-item-label",
46
+ className: e(o, "group-has-[[data-checked]]/radio-group-item:text-foreground", "group-has-[[data-disabled]]/radio-group-item:text-disabled-foreground", t),
47
+ ...n
48
+ }));
49
+ g.displayName = "RadioGroupItemLabel";
50
+ var _ = s(({ className: t, ...n }, r) => /* @__PURE__ */ c("span", {
51
+ ref: r,
52
+ "data-slot": "radio-group-item-description",
53
+ className: e(a, "group-has-[[data-disabled]]/radio-group-item:text-disabled-foreground", t),
54
+ ...n
55
+ }));
56
+ _.displayName = "RadioGroupItemDescription";
57
+ //#endregion
58
+ export { f as RadioGroup, m as RadioGroupItem, h as RadioGroupItemControl, _ as RadioGroupItemDescription, g as RadioGroupItemLabel };
@@ -1,88 +1,57 @@
1
- import { jsx as n, jsxs as d } from "react/jsx-runtime";
2
- import { createContext as g, forwardRef as s, useContext as c } from "react";
3
- import { IconBrain as m } from "@tabler/icons-react";
4
- import { cn as i } from "../../../../lib/utils.js";
5
- const l = g(!0), p = () => c(l), b = s(
6
- ({ className: t, children: e, ...o }, a) => /* @__PURE__ */ n(
7
- "div",
8
- {
9
- ref: a,
10
- "data-slot": "reasoning",
11
- className: i(
12
- "relative flex w-full flex-col gap-2 not-prose py-2",
13
- t
14
- ),
15
- ...o,
16
- children: e
17
- }
18
- )
19
- );
20
- b.displayName = "Reasoning";
21
- const u = s(
22
- ({ className: t, title: e = "Reasoning", children: o, ...a }, r) => /* @__PURE__ */ d(
23
- "div",
24
- {
25
- ref: r,
26
- "data-slot": "reasoning-header",
27
- className: i(
28
- "flex items-center gap-2 text-base leading-5 tracking-tighter text-muted-foreground",
29
- t
30
- ),
31
- ...a,
32
- children: [
33
- /* @__PURE__ */ n(m, { className: "size-4 shrink-0" }),
34
- o ?? /* @__PURE__ */ n("span", { children: e })
35
- ]
36
- }
37
- )
38
- );
1
+ import { cn as e } from "../../../../lib/utils.js";
2
+ import { createContext as t, forwardRef as n, useContext as r } from "react";
3
+ import { IconBrain as i } from "@tabler/icons-react";
4
+ import { jsx as a, jsxs as o } from "react/jsx-runtime";
5
+ //#region libs/aura/src/components/ui/core/reasoning/reasoning.tsx
6
+ var s = t(!0), c = () => r(s), l = n(({ className: t, children: n, ...r }, i) => /* @__PURE__ */ a("div", {
7
+ ref: i,
8
+ "data-slot": "reasoning",
9
+ className: e("relative flex w-full flex-col gap-2 not-prose py-2", t),
10
+ ...r,
11
+ children: n
12
+ }));
13
+ l.displayName = "Reasoning";
14
+ var u = n(({ className: t, title: n = "Reasoning", children: r, ...s }, c) => /* @__PURE__ */ o("div", {
15
+ ref: c,
16
+ "data-slot": "reasoning-header",
17
+ className: e("flex items-center gap-2 text-base leading-5 tracking-tighter text-muted-foreground", t),
18
+ ...s,
19
+ children: [/* @__PURE__ */ a(i, { className: "size-4 shrink-0" }), r ?? /* @__PURE__ */ a("span", { children: n })]
20
+ }));
39
21
  u.displayName = "ReasoningHeader";
40
- const x = s(
41
- ({ className: t, children: e, ...o }, a) => {
42
- const r = Array.isArray(e) && e.filter(Boolean).length > 1;
43
- return /* @__PURE__ */ n(l.Provider, { value: r, children: /* @__PURE__ */ n(f, { ref: a, className: t, ...o, children: e }) });
44
- }
45
- );
46
- x.displayName = "ReasoningContent";
47
- const f = s(({ className: t, children: e, ...o }, a) => /* @__PURE__ */ n(
48
- "div",
49
- {
50
- ref: a,
51
- "data-slot": "reasoning-content-inner",
52
- className: i("relative flex flex-col gap-0 pl-4", t),
53
- ...o,
54
- children: e
55
- }
56
- ));
22
+ var d = n(({ className: e, children: t, ...n }, r) => {
23
+ let i = Array.isArray(t) && t.filter(Boolean).length > 1;
24
+ return /* @__PURE__ */ a(s.Provider, {
25
+ value: i,
26
+ children: /* @__PURE__ */ a(f, {
27
+ ref: r,
28
+ className: e,
29
+ ...n,
30
+ children: t
31
+ })
32
+ });
33
+ });
34
+ d.displayName = "ReasoningContent";
35
+ var f = n(({ className: t, children: n, ...r }, i) => /* @__PURE__ */ a("div", {
36
+ ref: i,
37
+ "data-slot": "reasoning-content-inner",
38
+ className: e("relative flex flex-col gap-0 pl-4", t),
39
+ ...r,
40
+ children: n
41
+ }));
57
42
  f.displayName = "ReasoningContentInner";
58
- const R = s(
59
- ({ className: t, children: e, ...o }, a) => {
60
- const r = p();
61
- return /* @__PURE__ */ n(
62
- "div",
63
- {
64
- ref: a,
65
- "data-slot": "reasoning-item",
66
- className: i(
67
- "relative",
68
- r && [
69
- "before:absolute before:-left-2.75 before:top-4 before:z-10 before:size-1.75 before:rounded-full before:bg-border",
70
- "after:absolute after:-left-2 after:top-0 after:bottom-0 after:w-px after:bg-border",
71
- "first:after:top-4",
72
- "last:after:bottom-auto last:after:h-4"
73
- ],
74
- t
75
- ),
76
- ...o,
77
- children: e
78
- }
79
- );
80
- }
81
- );
82
- R.displayName = "ReasoningItem";
83
- export {
84
- b as Reasoning,
85
- x as ReasoningContent,
86
- u as ReasoningHeader,
87
- R as ReasoningItem
88
- };
43
+ var p = n(({ className: t, children: n, ...r }, i) => /* @__PURE__ */ a("div", {
44
+ ref: i,
45
+ "data-slot": "reasoning-item",
46
+ className: e("relative", c() && [
47
+ "before:absolute before:-left-2.75 before:top-4 before:z-10 before:size-1.75 before:rounded-full before:bg-border",
48
+ "after:absolute after:-left-2 after:top-0 after:bottom-0 after:w-px after:bg-border",
49
+ "first:after:top-4",
50
+ "last:after:bottom-auto last:after:h-4"
51
+ ], t),
52
+ ...r,
53
+ children: n
54
+ }));
55
+ p.displayName = "ReasoningItem";
56
+ //#endregion
57
+ export { l as Reasoning, d as ReasoningContent, u as ReasoningHeader, p as ReasoningItem };
@@ -1,71 +1,41 @@
1
- import { jsxs as d, jsx as r } from "react/jsx-runtime";
2
- import { forwardRef as i } from "react";
3
- import { ScrollArea as o } from "@base-ui/react/scroll-area";
4
- import { focusRing as m, cn as s } from "../../../../lib/utils.js";
5
- const p = i(
6
- ({
7
- className: a,
8
- children: l,
9
- ...e
10
- }, t) => /* @__PURE__ */ d(
11
- o.Root,
12
- {
13
- ref: t,
14
- "data-slot": "scroll-area",
15
- className: s("relative group/scroll-area", a),
16
- ...e,
17
- children: [
18
- /* @__PURE__ */ r(
19
- o.Viewport,
20
- {
21
- "data-slot": "scroll-area-viewport",
22
- className: `size-full rounded-[inherit] transition-[color,box-shadow] ${m}`,
23
- children: /* @__PURE__ */ r(o.Content, { "data-slot": "scroll-area-content", children: l })
24
- }
25
- ),
26
- /* @__PURE__ */ r(c, { orientation: "vertical" }),
27
- /* @__PURE__ */ r(c, { orientation: "horizontal" }),
28
- /* @__PURE__ */ r(o.Corner, { "data-slot": "scroll-area-corner" })
29
- ]
30
- }
31
- )
32
- ), c = i(
33
- ({
34
- className: a,
35
- orientation: l = "vertical",
36
- ...e
37
- }, t) => {
38
- const n = l === "horizontal";
39
- return /* @__PURE__ */ r(
40
- o.Scrollbar,
41
- {
42
- ref: t,
43
- "data-slot": "scroll-area-scrollbar",
44
- "data-orientation": l,
45
- orientation: l,
46
- className: s(
47
- "group/scroll-area-scrollbar flex touch-none select-none items-start transition-colors",
48
- n ? "w-full py-0.5 px-3" : "inline-flex self-stretch px-0.5 py-3",
49
- a
50
- ),
51
- ...e,
52
- children: /* @__PURE__ */ r(
53
- o.Thumb,
54
- {
55
- "data-slot": "scroll-area-thumb",
56
- className: s(
57
- "relative rounded-full bg-secondary-background transition-colors group-hover/scroll-area-scrollbar:bg-secondary-background-hover",
58
- n ? "h-1 min-w-10" : "w-1 min-h-10"
59
- )
60
- }
61
- )
62
- }
63
- );
64
- }
65
- );
66
- p.displayName = "ScrollArea";
67
- c.displayName = "ScrollBar";
68
- export {
69
- p as ScrollArea,
70
- c as ScrollBar
71
- };
1
+ import { cn as e, focusRing as t } from "../../../../lib/utils.js";
2
+ import { forwardRef as n } from "react";
3
+ import { jsx as r, jsxs as i } from "react/jsx-runtime";
4
+ import { ScrollArea as a } from "@base-ui/react/scroll-area";
5
+ //#region libs/aura/src/components/ui/core/scroll-area/scroll-area.tsx
6
+ var o = n(({ className: n, children: o, ...c }, l) => /* @__PURE__ */ i(a.Root, {
7
+ ref: l,
8
+ "data-slot": "scroll-area",
9
+ className: e("relative group/scroll-area", n),
10
+ ...c,
11
+ children: [
12
+ /* @__PURE__ */ r(a.Viewport, {
13
+ "data-slot": "scroll-area-viewport",
14
+ className: `size-full rounded-[inherit] transition-[color,box-shadow] ${t}`,
15
+ children: /* @__PURE__ */ r(a.Content, {
16
+ "data-slot": "scroll-area-content",
17
+ children: o
18
+ })
19
+ }),
20
+ /* @__PURE__ */ r(s, { orientation: "vertical" }),
21
+ /* @__PURE__ */ r(s, { orientation: "horizontal" }),
22
+ /* @__PURE__ */ r(a.Corner, { "data-slot": "scroll-area-corner" })
23
+ ]
24
+ })), s = n(({ className: t, orientation: n = "vertical", ...i }, o) => {
25
+ let s = n === "horizontal";
26
+ return /* @__PURE__ */ r(a.Scrollbar, {
27
+ ref: o,
28
+ "data-slot": "scroll-area-scrollbar",
29
+ "data-orientation": n,
30
+ orientation: n,
31
+ className: e("group/scroll-area-scrollbar flex touch-none select-none items-start transition-colors", s ? "w-full py-0.5 px-3" : "inline-flex self-stretch px-0.5 py-3", t),
32
+ ...i,
33
+ children: /* @__PURE__ */ r(a.Thumb, {
34
+ "data-slot": "scroll-area-thumb",
35
+ className: e("relative rounded-full bg-secondary-background transition-colors group-hover/scroll-area-scrollbar:bg-secondary-background-hover", s ? "h-1 min-w-10" : "w-1 min-h-10")
36
+ })
37
+ });
38
+ });
39
+ o.displayName = "ScrollArea", s.displayName = "ScrollBar";
40
+ //#endregion
41
+ export { o as ScrollArea, s as ScrollBar };
@@ -1,99 +1,77 @@
1
- import { jsx as t, jsxs as A } from "react/jsx-runtime";
2
- import { forwardRef as D, useState as f, useRef as H, useImperativeHandle as R } from "react";
3
- import { IconSearch as M, IconCircleXFilled as U } from "@tabler/icons-react";
4
- import { cn as m } from "../../../../lib/utils.js";
5
- import { InputGroup as W, InputGroupAddon as g, InputGroupInput as L, InputGroupButton as O } from "../input-group/input-group.js";
6
- const s = (n) => typeof n == "string" ? n.length > 0 : typeof n == "number" ? Number.isFinite(n) : Array.isArray(n) ? n.length > 0 : !1, P = D(
7
- ({
8
- className: n,
9
- inputClassName: I,
10
- clearLabel: b = "Clear search",
11
- onClear: i,
12
- value: o,
13
- defaultValue: c,
14
- onChange: C,
15
- onInput: w,
16
- onFocus: F,
17
- onBlur: N,
18
- disabled: l,
19
- readOnly: u,
20
- ...y
21
- }, T) => {
22
- const [x, p] = f(!1), [E, d] = f(() => s(o ?? c)), a = H(null), r = o != null, k = r ? s(o) : E;
23
- R(T, () => a.current, []);
24
- const v = () => {
25
- p(!0);
26
- }, B = (e) => {
27
- e.relatedTarget instanceof Node && e.currentTarget.contains(e.relatedTarget) || p(!1);
28
- }, G = () => {
29
- const e = a.current;
30
- e != null && (i?.(), !r && e.value !== "" && (Object.getOwnPropertyDescriptor(
31
- HTMLInputElement.prototype,
32
- "value"
33
- )?.set?.call(e, ""), e.dispatchEvent(new Event("input", { bubbles: !0 })), e.dispatchEvent(new Event("change", { bubbles: !0 }))), e.focus());
34
- }, S = (e) => {
35
- r || d(s(e.currentTarget.value)), w?.(e);
36
- }, j = (e) => {
37
- r || d(s(e.currentTarget.value)), C?.(e);
38
- }, z = !r || i != null, h = x && k && !l && !u && z;
39
- return /* @__PURE__ */ t(
40
- "div",
41
- {
42
- "data-slot": "search",
43
- className: m("w-full cursor-text", n),
44
- onFocusCapture: v,
45
- onBlurCapture: B,
46
- onClick: () => a.current?.focus(),
47
- children: /* @__PURE__ */ A(W, { className: "w-full transition-none", children: [
48
- /* @__PURE__ */ t(g, { align: "inline-start", children: /* @__PURE__ */ t(M, { className: "size-4", "aria-hidden": !0 }) }),
49
- /* @__PURE__ */ t(
50
- L,
51
- {
52
- ...y,
53
- ref: a,
54
- type: "search",
55
- value: o,
56
- defaultValue: c,
57
- disabled: l,
58
- readOnly: u,
59
- onInput: S,
60
- onChange: j,
61
- onFocus: F,
62
- onBlur: N,
63
- className: m(
64
- "placeholder:text-muted-foreground [&::-webkit-search-cancel-button]:appearance-none [&::-webkit-search-decoration]:appearance-none",
65
- I
66
- )
67
- }
68
- ),
69
- /* @__PURE__ */ t(
70
- g,
71
- {
72
- align: "inline-end",
73
- "aria-hidden": h ? void 0 : !0,
74
- className: h ? void 0 : "invisible pointer-events-none",
75
- children: /* @__PURE__ */ t(
76
- O,
77
- {
78
- type: "button",
79
- variant: "ghost",
80
- size: "icon-sm",
81
- "aria-label": b,
82
- onMouseDown: (e) => {
83
- e.preventDefault();
84
- },
85
- onClick: G,
86
- children: /* @__PURE__ */ t(U, { className: "size-4", "aria-hidden": !0 })
87
- }
88
- )
89
- }
90
- )
91
- ] })
92
- }
93
- );
94
- }
95
- );
96
- P.displayName = "Search";
97
- export {
98
- P as Search
99
- };
1
+ import { cn as e } from "../../../../lib/utils.js";
2
+ import { InputGroup as t, InputGroupAddon as n, InputGroupButton as r, InputGroupInput as i } from "../input-group/input-group.js";
3
+ import { forwardRef as a, useImperativeHandle as o, useRef as s, useState as c } from "react";
4
+ import { IconCircleXFilled as l, IconSearch as u } from "@tabler/icons-react";
5
+ import { jsx as d, jsxs as f } from "react/jsx-runtime";
6
+ //#region libs/aura/src/components/ui/core/search/search.tsx
7
+ var p = (e) => typeof e == "string" ? e.length > 0 : typeof e == "number" ? Number.isFinite(e) : Array.isArray(e) ? e.length > 0 : !1, m = a(({ className: a, inputClassName: m, clearLabel: h = "Clear search", onClear: g, value: _, defaultValue: v, onChange: y, onInput: b, onFocus: x, onBlur: S, disabled: C, readOnly: w, ...T }, E) => {
8
+ let [D, O] = c(!1), [k, A] = c(() => p(_ ?? v)), j = s(null), M = _ != null, N = M ? p(_) : k;
9
+ o(E, () => j.current, []);
10
+ let P = () => {
11
+ O(!0);
12
+ }, F = (e) => {
13
+ e.relatedTarget instanceof Node && e.currentTarget.contains(e.relatedTarget) || O(!1);
14
+ }, I = () => {
15
+ let e = j.current;
16
+ e != null && (g?.(), !M && e.value !== "" && (Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, "value")?.set?.call(e, ""), e.dispatchEvent(new Event("input", { bubbles: !0 })), e.dispatchEvent(new Event("change", { bubbles: !0 }))), e.focus());
17
+ }, L = (e) => {
18
+ M || A(p(e.currentTarget.value)), b?.(e);
19
+ }, R = (e) => {
20
+ M || A(p(e.currentTarget.value)), y?.(e);
21
+ }, z = D && N && !C && !w && (!M || g != null);
22
+ return /* @__PURE__ */ d("div", {
23
+ "data-slot": "search",
24
+ className: e("w-full cursor-text", a),
25
+ onFocusCapture: P,
26
+ onBlurCapture: F,
27
+ onClick: () => j.current?.focus(),
28
+ children: /* @__PURE__ */ f(t, {
29
+ className: "w-full transition-none",
30
+ children: [
31
+ /* @__PURE__ */ d(n, {
32
+ align: "inline-start",
33
+ children: /* @__PURE__ */ d(u, {
34
+ className: "size-4",
35
+ "aria-hidden": !0
36
+ })
37
+ }),
38
+ /* @__PURE__ */ d(i, {
39
+ ...T,
40
+ ref: j,
41
+ type: "search",
42
+ value: _,
43
+ defaultValue: v,
44
+ disabled: C,
45
+ readOnly: w,
46
+ onInput: L,
47
+ onChange: R,
48
+ onFocus: x,
49
+ onBlur: S,
50
+ className: e("placeholder:text-muted-foreground [&::-webkit-search-cancel-button]:appearance-none [&::-webkit-search-decoration]:appearance-none", m)
51
+ }),
52
+ /* @__PURE__ */ d(n, {
53
+ align: "inline-end",
54
+ "aria-hidden": !z || void 0,
55
+ className: z ? void 0 : "invisible pointer-events-none",
56
+ children: /* @__PURE__ */ d(r, {
57
+ type: "button",
58
+ variant: "ghost",
59
+ size: "icon-sm",
60
+ "aria-label": h,
61
+ onMouseDown: (e) => {
62
+ e.preventDefault();
63
+ },
64
+ onClick: I,
65
+ children: /* @__PURE__ */ d(l, {
66
+ className: "size-4",
67
+ "aria-hidden": !0
68
+ })
69
+ })
70
+ })
71
+ ]
72
+ })
73
+ });
74
+ });
75
+ m.displayName = "Search";
76
+ //#endregion
77
+ export { m as Search };