@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,133 +1,68 @@
1
- import { jsx as o, jsxs as s } from "react/jsx-runtime";
2
- import { forwardRef as r } from "react";
3
- import { Checkbox as i } from "@base-ui/react/checkbox";
4
- import { IconCheck as l, IconMinus as b } from "@tabler/icons-react";
5
- import { cva as m } from "class-variance-authority";
6
- import { cn as d, selectionItemBase as h, selectionItemCard as k, selectionItemDefault as u, invalidState as x, focusState as p, selectionItemLabel as g, selectionItemDescription as f } from "../../../../lib/utils.js";
7
- const I = r(
8
- ({ className: a, orientation: e = "vertical", role: t = "group", ...c }, n) => /* @__PURE__ */ o(
9
- "div",
10
- {
11
- ref: n,
12
- role: t,
13
- "data-slot": "checkbox-group",
14
- "data-orientation": e,
15
- className: d(
16
- e === "horizontal" ? "flex items-center gap-2" : "grid has-[[data-variant=card]]:gap-2",
17
- a
18
- ),
19
- ...c
20
- }
21
- )
22
- );
23
- I.displayName = "CheckboxGroup";
24
- const C = m(d("group/checkbox-item", h), {
25
- variants: {
26
- variant: {
27
- default: u,
28
- card: k
29
- }
30
- },
31
- defaultVariants: {
32
- variant: "default"
33
- }
34
- }), v = r(
35
- ({ className: a, variant: e, ...t }, c) => /* @__PURE__ */ o(
36
- "label",
37
- {
38
- ref: c,
39
- "data-slot": "checkbox-item",
40
- "data-variant": e ?? "default",
41
- className: d(C({ variant: e }), a),
42
- ...t
43
- }
44
- )
45
- );
46
- v.displayName = "CheckboxItem";
47
- const N = r(({ className: a, ...e }, t) => /* @__PURE__ */ o(
48
- i.Root,
49
- {
50
- ref: t,
51
- "data-slot": "checkbox-item-control",
52
- className: d(
53
- "peer relative size-4 shrink-0 rounded-sm border-[1.5px] border-inactive-foreground bg-transparent text-foreground-on-primary outline-none transition-colors",
54
- "[&:is([data-checked],[data-indeterminate]):not([data-disabled])]:border-transparent [&:is([data-checked],[data-indeterminate]):not([data-disabled])]:bg-primary-background",
55
- "data-unchecked:not-data-disabled:hover:border-secondary-foreground group-hover/checkbox-item:data-unchecked:not-data-disabled:border-secondary-foreground",
56
- "data-disabled:pointer-events-none data-disabled:cursor-not-allowed data-disabled:border-transparent data-disabled:bg-disabled-background data-disabled:text-disabled-foreground data-disabled:data-unchecked:border-border",
57
- "[&[data-checked]_[data-slot=checkbox-check]]:block [&[data-indeterminate]_[data-slot=checkbox-dash]]:block",
58
- p,
59
- x,
60
- a
61
- ),
62
- ...e,
63
- children: /* @__PURE__ */ s(
64
- i.Indicator,
65
- {
66
- "data-slot": "checkbox-indicator",
67
- className: "grid size-full place-content-center text-current transition-none",
68
- children: [
69
- /* @__PURE__ */ o(
70
- l,
71
- {
72
- "aria-hidden": "true",
73
- "data-slot": "checkbox-check",
74
- className: "hidden size-3",
75
- stroke: 3
76
- }
77
- ),
78
- /* @__PURE__ */ o(
79
- b,
80
- {
81
- "aria-hidden": "true",
82
- "data-slot": "checkbox-dash",
83
- className: "hidden size-3",
84
- stroke: 3.5
85
- }
86
- )
87
- ]
88
- }
89
- )
90
- }
91
- ));
92
- N.displayName = "CheckboxItemControl";
93
- const y = r(
94
- ({ className: a, ...e }, t) => /* @__PURE__ */ o(
95
- "span",
96
- {
97
- ref: t,
98
- "data-slot": "checkbox-item-label",
99
- className: d(
100
- g,
101
- "group-has-[[data-checked]]/checkbox-item:text-foreground",
102
- "group-has-[[data-indeterminate]]/checkbox-item:text-foreground",
103
- "group-has-[[data-disabled]]/checkbox-item:text-disabled-foreground",
104
- a
105
- ),
106
- ...e
107
- }
108
- )
109
- );
1
+ import { cn as e, focusState as t, invalidState as n, selectionItemBase as r, selectionItemCard as i, selectionItemDefault as a, selectionItemDescription as o, selectionItemLabel as s } from "../../../../lib/utils.js";
2
+ import { forwardRef as c } from "react";
3
+ import { IconCheck as l, IconMinus as u } from "@tabler/icons-react";
4
+ import { jsx as d, jsxs as f } from "react/jsx-runtime";
5
+ import { cva as p } from "class-variance-authority";
6
+ import { Checkbox as m } from "@base-ui/react/checkbox";
7
+ //#region libs/aura/src/components/ui/core/checkbox/checkbox.tsx
8
+ var h = c(({ className: t, orientation: n = "vertical", role: r = "group", ...i }, a) => /* @__PURE__ */ d("div", {
9
+ ref: a,
10
+ role: r,
11
+ "data-slot": "checkbox-group",
12
+ "data-orientation": n,
13
+ className: e(n === "horizontal" ? "flex items-center gap-2" : "grid has-[[data-variant=card]]:gap-2", t),
14
+ ...i
15
+ }));
16
+ h.displayName = "CheckboxGroup";
17
+ var g = p(e("group/checkbox-item", r), {
18
+ variants: { variant: {
19
+ default: a,
20
+ card: i
21
+ } },
22
+ defaultVariants: { variant: "default" }
23
+ }), _ = c(({ className: t, variant: n, ...r }, i) => /* @__PURE__ */ d("label", {
24
+ ref: i,
25
+ "data-slot": "checkbox-item",
26
+ "data-variant": n ?? "default",
27
+ className: e(g({ variant: n }), t),
28
+ ...r
29
+ }));
30
+ _.displayName = "CheckboxItem";
31
+ var v = c(({ className: r, ...i }, a) => /* @__PURE__ */ d(m.Root, {
32
+ ref: a,
33
+ "data-slot": "checkbox-item-control",
34
+ className: e("peer relative size-4 shrink-0 rounded-sm border-[1.5px] border-inactive-foreground bg-transparent text-foreground-on-primary outline-none transition-colors", "[&:is([data-checked],[data-indeterminate]):not([data-disabled])]:border-transparent [&:is([data-checked],[data-indeterminate]):not([data-disabled])]:bg-primary-background", "data-unchecked:not-data-disabled:hover:border-secondary-foreground group-hover/checkbox-item:data-unchecked:not-data-disabled:border-secondary-foreground", "data-disabled:pointer-events-none data-disabled:cursor-not-allowed data-disabled:border-transparent data-disabled:bg-disabled-background data-disabled:text-disabled-foreground data-disabled:data-unchecked:border-border", "[&[data-checked]_[data-slot=checkbox-check]]:block [&[data-indeterminate]_[data-slot=checkbox-dash]]:block", t, n, r),
35
+ ...i,
36
+ children: /* @__PURE__ */ f(m.Indicator, {
37
+ "data-slot": "checkbox-indicator",
38
+ className: "grid size-full place-content-center text-current transition-none",
39
+ children: [/* @__PURE__ */ d(l, {
40
+ "aria-hidden": "true",
41
+ "data-slot": "checkbox-check",
42
+ className: "hidden size-3",
43
+ stroke: 3
44
+ }), /* @__PURE__ */ d(u, {
45
+ "aria-hidden": "true",
46
+ "data-slot": "checkbox-dash",
47
+ className: "hidden size-3",
48
+ stroke: 3.5
49
+ })]
50
+ })
51
+ }));
52
+ v.displayName = "CheckboxItemControl";
53
+ var y = c(({ className: t, ...n }, r) => /* @__PURE__ */ d("span", {
54
+ ref: r,
55
+ "data-slot": "checkbox-item-label",
56
+ className: e(s, "group-has-[[data-checked]]/checkbox-item:text-foreground", "group-has-[[data-indeterminate]]/checkbox-item:text-foreground", "group-has-[[data-disabled]]/checkbox-item:text-disabled-foreground", t),
57
+ ...n
58
+ }));
110
59
  y.displayName = "CheckboxItemLabel";
111
- const z = r(
112
- ({ className: a, ...e }, t) => /* @__PURE__ */ o(
113
- "span",
114
- {
115
- ref: t,
116
- "data-slot": "checkbox-item-description",
117
- className: d(
118
- f,
119
- "group-has-[[data-disabled]]/checkbox-item:text-disabled-foreground",
120
- a
121
- ),
122
- ...e
123
- }
124
- )
125
- );
126
- z.displayName = "CheckboxItemDescription";
127
- export {
128
- I as CheckboxGroup,
129
- v as CheckboxItem,
130
- N as CheckboxItemControl,
131
- z as CheckboxItemDescription,
132
- y as CheckboxItemLabel
133
- };
60
+ var b = c(({ className: t, ...n }, r) => /* @__PURE__ */ d("span", {
61
+ ref: r,
62
+ "data-slot": "checkbox-item-description",
63
+ className: e(o, "group-has-[[data-disabled]]/checkbox-item:text-disabled-foreground", t),
64
+ ...n
65
+ }));
66
+ b.displayName = "CheckboxItemDescription";
67
+ //#endregion
68
+ export { h as CheckboxGroup, _ as CheckboxItem, v as CheckboxItemControl, b as CheckboxItemDescription, y as CheckboxItemLabel };
@@ -1,8 +1,8 @@
1
- const e = {
2
- name: "Checkbox",
3
- description: "A composable checkbox group with optional label and description slots, including a card-style item variant and support for checked, unchecked, and indeterminate states.",
4
- llmUsage: 'Use `<CheckboxGroup>` with `<CheckboxItem>` wrapping `<CheckboxItemControl />`, plus optional `<CheckboxItemLabel>` and `<CheckboxItemDescription>`. Always pass an accessible name on `<CheckboxItemControl>` via `aria-label` (or `aria-labelledby` pointing to the label\'s id) — the wrapping `<label>` element names the underlying hidden form input, but does not name the visible `role="checkbox"` element that screen readers focus on. `<CheckboxItemDescription>` is a visual slot at this primitive layer; if you need it announced by screen readers, give it an `id` and pass `aria-describedby` to `<CheckboxItemControl>`. Use `variant="card"` on `<CheckboxItem>` for card-style options. `<CheckboxItemControl>` supports `checked`, `defaultChecked`, `indeterminate`, `onCheckedChange`, `disabled`, and `required` for form integration.'
5
- };
6
- export {
7
- e as CheckboxMetadata
1
+ //#region libs/aura/src/components/ui/core/checkbox/checkbox.metadata.ts
2
+ var e = {
3
+ name: "Checkbox",
4
+ description: "A composable checkbox group with optional label and description slots, including a card-style item variant and support for checked, unchecked, and indeterminate states.",
5
+ llmUsage: "Use `<CheckboxGroup>` with `<CheckboxItem>` wrapping `<CheckboxItemControl />`, plus optional `<CheckboxItemLabel>` and `<CheckboxItemDescription>`. Always pass an accessible name on `<CheckboxItemControl>` via `aria-label` (or `aria-labelledby` pointing to the label's id) — the wrapping `<label>` element names the underlying hidden form input, but does not name the visible `role=\"checkbox\"` element that screen readers focus on. `<CheckboxItemDescription>` is a visual slot at this primitive layer; if you need it announced by screen readers, give it an `id` and pass `aria-describedby` to `<CheckboxItemControl>`. Use `variant=\"card\"` on `<CheckboxItem>` for card-style options. `<CheckboxItemControl>` supports `checked`, `defaultChecked`, `indeterminate`, `onCheckedChange`, `disabled`, and `required` for form integration."
8
6
  };
7
+ //#endregion
8
+ export { e as CheckboxMetadata };
@@ -1,5 +1,5 @@
1
1
  import { ComponentProps, ForwardRefExoticComponent, HTMLAttributes, RefAttributes } from 'react';
2
- import { BundledLanguage } from 'shiki';
2
+ import { BundledLanguage } from 'shiki/bundle/web';
3
3
  import { Button } from '../button/button';
4
4
  export declare function getCollapsedPreviewDisplay(code: string): string;
5
5
  export declare function isContentLargerThanPreview(code: string): boolean;