@dxos/react-ui 0.8.3-main.7f5a14c → 0.8.3-staging.0fa589b

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 (48) hide show
  1. package/dist/lib/{node-esm/chunk-ANVE7WX5.mjs → browser/chunk-WXW6KSRL.mjs} +39 -20
  2. package/dist/lib/browser/chunk-WXW6KSRL.mjs.map +7 -0
  3. package/dist/lib/browser/index.mjs +5 -1
  4. package/dist/lib/browser/index.mjs.map +1 -1
  5. package/dist/lib/browser/meta.json +1 -1
  6. package/dist/lib/browser/testing/index.mjs +3 -3
  7. package/dist/lib/browser/testing/index.mjs.map +2 -2
  8. package/dist/lib/node/{chunk-KMS7RFL7.cjs → chunk-3E3QKWX4.cjs} +44 -21
  9. package/dist/lib/node/chunk-3E3QKWX4.cjs.map +7 -0
  10. package/dist/lib/node/index.cjs +73 -69
  11. package/dist/lib/node/index.cjs.map +1 -1
  12. package/dist/lib/node/meta.json +1 -1
  13. package/dist/lib/node/testing/index.cjs +4 -4
  14. package/dist/lib/node/testing/index.cjs.map +2 -2
  15. package/dist/lib/{browser/chunk-5Y5JI6KC.mjs → node-esm/chunk-EQ7EG74H.mjs} +41 -18
  16. package/dist/lib/node-esm/chunk-EQ7EG74H.mjs.map +7 -0
  17. package/dist/lib/node-esm/index.mjs +5 -1
  18. package/dist/lib/node-esm/index.mjs.map +1 -1
  19. package/dist/lib/node-esm/meta.json +1 -1
  20. package/dist/lib/node-esm/testing/index.mjs +3 -3
  21. package/dist/lib/node-esm/testing/index.mjs.map +2 -2
  22. package/dist/types/src/components/Input/Input.d.ts.map +1 -1
  23. package/dist/types/src/components/Message/Message.d.ts +14 -5
  24. package/dist/types/src/components/Message/Message.d.ts.map +1 -1
  25. package/dist/types/src/components/Message/Message.stories.d.ts +1 -1
  26. package/dist/types/src/components/Message/Message.stories.d.ts.map +1 -1
  27. package/dist/types/src/components/Separator/Separator.d.ts +5 -1
  28. package/dist/types/src/components/Separator/Separator.d.ts.map +1 -1
  29. package/dist/types/src/components/ThemeProvider/TranslationsProvider.d.ts +1 -0
  30. package/dist/types/src/components/ThemeProvider/TranslationsProvider.d.ts.map +1 -1
  31. package/dist/types/src/components/Toolbar/Toolbar.d.ts +7 -1
  32. package/dist/types/src/components/Toolbar/Toolbar.d.ts.map +1 -1
  33. package/dist/types/src/components/Toolbar/Toolbar.stories.d.ts +4 -0
  34. package/dist/types/src/components/Toolbar/Toolbar.stories.d.ts.map +1 -1
  35. package/dist/types/src/testing/decorators/withSurfaceVariantsLayout.d.ts.map +1 -1
  36. package/package.json +13 -13
  37. package/src/components/Input/Input.stories.tsx +2 -2
  38. package/src/components/Input/Input.tsx +1 -0
  39. package/src/components/Menus/ContextMenu.stories.tsx +1 -1
  40. package/src/components/Message/Message.stories.tsx +7 -10
  41. package/src/components/Message/Message.tsx +50 -19
  42. package/src/components/Separator/Separator.tsx +3 -3
  43. package/src/components/ThemeProvider/TranslationsProvider.tsx +1 -1
  44. package/src/components/Toolbar/Toolbar.tsx +15 -9
  45. package/src/testing/decorators/withSurfaceVariantsLayout.tsx +2 -4
  46. package/dist/lib/browser/chunk-5Y5JI6KC.mjs.map +0 -7
  47. package/dist/lib/node/chunk-KMS7RFL7.cjs.map +0 -7
  48. package/dist/lib/node-esm/chunk-ANVE7WX5.mjs.map +0 -7
@@ -1,5 +1,3 @@
1
- import { createRequire } from 'node:module';const require = createRequire(import.meta.url);
2
-
3
1
  // packages/ui/react-ui/src/hooks/useDensityContext.ts
4
2
  import { useContext as useContext6 } from "react";
5
3
 
@@ -1773,7 +1771,7 @@ var TextArea = /* @__PURE__ */ forwardRef13(({ __inputScope, classNames, density
1773
1771
  density,
1774
1772
  elevation,
1775
1773
  validationValence
1776
- }, classNames),
1774
+ }, "-mbe-labelSpacingBlock", classNames),
1777
1775
  ...props.autoFocus && !hasIosKeyboard2 && {
1778
1776
  autoFocus: true
1779
1777
  },
@@ -3233,9 +3231,16 @@ import { Primitive as Primitive11 } from "@radix-ui/react-primitive";
3233
3231
  import { Slot as Slot11 } from "@radix-ui/react-slot";
3234
3232
  import React28, { forwardRef as forwardRef20 } from "react";
3235
3233
  import { useId as useId4 } from "@dxos/react-hooks";
3234
+ var messageIcons = {
3235
+ success: "ph--check-circle--duotone",
3236
+ info: "ph--info--duotone",
3237
+ warning: "ph--warning--duotone",
3238
+ error: "ph--warning-circle--duotone",
3239
+ neutral: "ph--info--duotone"
3240
+ };
3236
3241
  var MESSAGE_NAME = "Message";
3237
3242
  var [MessageProvider, useMessageContext] = createContext11(MESSAGE_NAME);
3238
- var MessageRoot = /* @__PURE__ */ forwardRef20(({ asChild, valence, elevation: propsElevation, className, titleId: propsTitleId, descriptionId: propsDescriptionId, children, ...props }, forwardedRef) => {
3243
+ var MessageRoot = /* @__PURE__ */ forwardRef20(({ asChild, valence = "neutral", elevation: propsElevation, classNames, titleId: propsTitleId, descriptionId: propsDescriptionId, children, ...props }, forwardedRef) => {
3239
3244
  var _effect = _useSignals28();
3240
3245
  try {
3241
3246
  const { tx } = useThemeContext();
@@ -3245,13 +3250,15 @@ var MessageRoot = /* @__PURE__ */ forwardRef20(({ asChild, valence, elevation: p
3245
3250
  const Root7 = asChild ? Slot11 : Primitive11.div;
3246
3251
  return /* @__PURE__ */ React28.createElement(MessageProvider, {
3247
3252
  titleId,
3248
- descriptionId
3253
+ descriptionId,
3254
+ valence
3249
3255
  }, /* @__PURE__ */ React28.createElement(Root7, {
3256
+ role: valence === "neutral" ? "paragraph" : "alert",
3250
3257
  ...props,
3251
3258
  className: tx("message.root", "message", {
3252
3259
  valence,
3253
3260
  elevation
3254
- }, className),
3261
+ }, classNames),
3255
3262
  "aria-labelledby": titleId,
3256
3263
  "aria-describedby": descriptionId,
3257
3264
  ref: forwardedRef
@@ -3262,25 +3269,31 @@ var MessageRoot = /* @__PURE__ */ forwardRef20(({ asChild, valence, elevation: p
3262
3269
  });
3263
3270
  MessageRoot.displayName = MESSAGE_NAME;
3264
3271
  var MESSAGE_TITLE_NAME = "MessageTitle";
3265
- var MessageTitle = /* @__PURE__ */ forwardRef20(({ asChild, className, children, ...props }, forwardedRef) => {
3272
+ var MessageTitle = /* @__PURE__ */ forwardRef20(({ asChild, classNames, children, icon, ...props }, forwardedRef) => {
3266
3273
  var _effect = _useSignals28();
3267
3274
  try {
3268
3275
  const { tx } = useThemeContext();
3269
- const { titleId } = useMessageContext(MESSAGE_TITLE_NAME);
3276
+ const { titleId, valence } = useMessageContext(MESSAGE_TITLE_NAME);
3270
3277
  const Root7 = asChild ? Slot11 : Primitive11.h2;
3271
3278
  return /* @__PURE__ */ React28.createElement(Root7, {
3272
3279
  ...props,
3273
- className: tx("message.title", "message__title", {}, className),
3280
+ className: tx("message.title", "message__title", {}, classNames),
3274
3281
  id: titleId,
3275
3282
  ref: forwardedRef
3276
- }, children);
3283
+ }, !icon && valence === "neutral" ? null : /* @__PURE__ */ React28.createElement(Icon, {
3284
+ size: 5,
3285
+ icon: icon ?? messageIcons[valence],
3286
+ classNames: tx("message.icon", "message__icon", {
3287
+ valence
3288
+ })
3289
+ }), /* @__PURE__ */ React28.createElement("span", null, children));
3277
3290
  } finally {
3278
3291
  _effect.f();
3279
3292
  }
3280
3293
  });
3281
3294
  MessageTitle.displayName = MESSAGE_TITLE_NAME;
3282
- var MESSAGE_BODY_NAME = "MessageBody";
3283
- var MessageBody = /* @__PURE__ */ forwardRef20(({ asChild, className, children, ...props }, forwardedRef) => {
3295
+ var MESSAGE_BODY_NAME = "MessageContent";
3296
+ var MessageContent = /* @__PURE__ */ forwardRef20(({ asChild, classNames, children, ...props }, forwardedRef) => {
3284
3297
  var _effect = _useSignals28();
3285
3298
  try {
3286
3299
  const { tx } = useThemeContext();
@@ -3288,7 +3301,7 @@ var MessageBody = /* @__PURE__ */ forwardRef20(({ asChild, className, children,
3288
3301
  const Root7 = asChild ? Slot11 : Primitive11.p;
3289
3302
  return /* @__PURE__ */ React28.createElement(Root7, {
3290
3303
  ...props,
3291
- className: tx("message.body", "message__body", {}, className),
3304
+ className: tx("message.content", "message__content", {}, classNames),
3292
3305
  id: descriptionId,
3293
3306
  ref: forwardedRef
3294
3307
  }, children);
@@ -3296,12 +3309,13 @@ var MessageBody = /* @__PURE__ */ forwardRef20(({ asChild, className, children,
3296
3309
  _effect.f();
3297
3310
  }
3298
3311
  });
3299
- MessageBody.displayName = MESSAGE_BODY_NAME;
3312
+ MessageContent.displayName = MESSAGE_BODY_NAME;
3300
3313
  var Message = {
3301
3314
  Root: MessageRoot,
3302
3315
  Title: MessageTitle,
3303
- Body: MessageBody
3316
+ Content: MessageContent
3304
3317
  };
3318
+ var Callout = Message;
3305
3319
 
3306
3320
  // packages/ui/react-ui/src/components/Popover/Popover.tsx
3307
3321
  import { useSignals as _useSignals29 } from "@preact-signals/safe-react/tracking";
@@ -3983,7 +3997,7 @@ var Select = {
3983
3997
  import { useSignals as _useSignals33 } from "@preact-signals/safe-react/tracking";
3984
3998
  import { Separator as SeparatorPrimitive } from "@radix-ui/react-separator";
3985
3999
  import React33, { forwardRef as forwardRef25 } from "react";
3986
- var Separator4 = /* @__PURE__ */ forwardRef25(({ classNames, orientation = "horizontal", ...props }, forwardedRef) => {
4000
+ var Separator4 = /* @__PURE__ */ forwardRef25(({ classNames, orientation = "horizontal", subdued, ...props }, forwardedRef) => {
3987
4001
  var _effect = _useSignals33();
3988
4002
  try {
3989
4003
  const { tx } = useThemeContext();
@@ -3991,7 +4005,8 @@ var Separator4 = /* @__PURE__ */ forwardRef25(({ classNames, orientation = "hori
3991
4005
  orientation,
3992
4006
  ...props,
3993
4007
  className: tx("separator.root", "separator", {
3994
- orientation
4008
+ orientation,
4009
+ subdued
3995
4010
  }, classNames),
3996
4011
  ref: forwardedRef
3997
4012
  });
@@ -4131,13 +4146,15 @@ var Toast = {
4131
4146
  import { useSignals as _useSignals36 } from "@preact-signals/safe-react/tracking";
4132
4147
  import * as ToolbarPrimitive from "@radix-ui/react-toolbar";
4133
4148
  import React36, { forwardRef as forwardRef28 } from "react";
4134
- var ToolbarRoot = /* @__PURE__ */ forwardRef28(({ classNames, children, ...props }, forwardedRef) => {
4149
+ var ToolbarRoot = /* @__PURE__ */ forwardRef28(({ classNames, children, layoutManaged, ...props }, forwardedRef) => {
4135
4150
  var _effect = _useSignals36();
4136
4151
  try {
4137
4152
  const { tx } = useThemeContext();
4138
4153
  return /* @__PURE__ */ React36.createElement(ToolbarPrimitive.Root, {
4139
4154
  ...props,
4140
- className: tx("toolbar.root", "toolbar", {}, classNames),
4155
+ className: tx("toolbar.root", "toolbar", {
4156
+ layoutManaged
4157
+ }, classNames),
4141
4158
  ref: forwardedRef
4142
4159
  }, children);
4143
4160
  } finally {
@@ -4343,7 +4360,9 @@ export {
4343
4360
  useDropdownMenuContext,
4344
4361
  DropdownMenu,
4345
4362
  useDropdownMenuMenuScope,
4363
+ messageIcons,
4346
4364
  Message,
4365
+ Callout,
4347
4366
  createPopoverScope,
4348
4367
  Popover,
4349
4368
  Status,
@@ -4354,4 +4373,4 @@ export {
4354
4373
  Toast,
4355
4374
  Toolbar
4356
4375
  };
4357
- //# sourceMappingURL=chunk-ANVE7WX5.mjs.map
4376
+ //# sourceMappingURL=chunk-WXW6KSRL.mjs.map