@dxos/react-ui 0.4.7-main.77593d4 → 0.4.7-main.7a94090

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.
@@ -148,12 +148,11 @@ import { Root as AvatarRootPrimitive, Fallback as AvatarFallbackPrimitive } from
148
148
  import { createContext as createContext2 } from "@radix-ui/react-context";
149
149
  import { Primitive as Primitive2 } from "@radix-ui/react-primitive";
150
150
  import { Slot as Slot2 } from "@radix-ui/react-slot";
151
- import { toSvg } from "jdenticon";
152
- import React3, { forwardRef as forwardRef2, useMemo } from "react";
151
+ import React3, { forwardRef as forwardRef2 } from "react";
153
152
  import { useId } from "@dxos/react-hooks";
154
153
  var AVATAR_NAME = "Avatar";
155
154
  var [AvatarProvider, useAvatarContext] = createContext2(AVATAR_NAME);
156
- var AvatarRoot = ({ size = 10, variant = "circle", status, animation, children, labelId: propsLabelId, descriptionId: propsDescriptionId, maskId: propsMaskId, inGroup, color }) => {
155
+ var AvatarRoot = ({ size = 10, variant = "circle", status, animation, children, labelId: propsLabelId, descriptionId: propsDescriptionId, maskId: propsMaskId, inGroup, hue }) => {
157
156
  const labelId = useId("avatar__label", propsLabelId);
158
157
  const descriptionId = useId("avatar__description", propsDescriptionId);
159
158
  const maskId = useId("avatar__mask", propsMaskId);
@@ -166,17 +165,17 @@ var AvatarRoot = ({ size = 10, variant = "circle", status, animation, children,
166
165
  status,
167
166
  animation,
168
167
  inGroup,
169
- color
168
+ hue
170
169
  }, children);
171
170
  };
172
171
  var rx = "0.25rem";
173
172
  var AvatarFrame = /* @__PURE__ */ forwardRef2(({ classNames, children, ...props }, forwardedRef) => {
174
- const { size, variant, labelId, descriptionId, maskId, inGroup, status, animation, color } = useAvatarContext("AvatarFrame");
173
+ const { size, variant, labelId, descriptionId, maskId, inGroup, status, animation, hue } = useAvatarContext("AvatarFrame");
175
174
  const { tx } = useThemeContext();
176
175
  const numericSize = size === "px" ? 1 : Number(size);
177
176
  const sizePx = numericSize * 4;
178
- const ringWidth = numericSize > 4 ? 2 : numericSize > 3 ? 1 : 1;
179
- const ringGap = numericSize > 12 ? 3 : numericSize > 4 ? 2 : numericSize > 3 ? 1 : 0;
177
+ const ringWidth = status ? numericSize > 4 ? 2 : numericSize > 3 ? 1 : 1 : 0;
178
+ const ringGap = status ? numericSize > 12 ? 3 : numericSize > 4 ? 2 : numericSize > 3 ? 1 : 0 : 0;
180
179
  const r = sizePx / 2 - ringGap - ringWidth;
181
180
  return /* @__PURE__ */ React3.createElement(AvatarRootPrimitive, {
182
181
  role: "img",
@@ -213,13 +212,12 @@ var AvatarFrame = /* @__PURE__ */ forwardRef2(({ classNames, children, ...props
213
212
  y: ringGap + ringWidth,
214
213
  rx
215
214
  }))), variant === "circle" ? /* @__PURE__ */ React3.createElement("circle", {
216
- className: `avatarFrameFill${color ? "" : " fill-[var(--surface-bg)]"}`,
215
+ className: hue ? tx("hue.fill", "avatar__frame__circle", {
216
+ hue
217
+ }) : "fill-[var(--surface-bg)]",
217
218
  cx: "50%",
218
219
  cy: "50%",
219
- r,
220
- ...color ? {
221
- fill: color
222
- } : {}
220
+ r
223
221
  }) : /* @__PURE__ */ React3.createElement("rect", {
224
222
  className: "avatarFrameFill fill-[var(--surface-bg)]",
225
223
  x: ringGap + ringWidth,
@@ -319,14 +317,6 @@ var AvatarFallback = /* @__PURE__ */ forwardRef2(({ delayMs, text, ...props }, f
319
317
  large: !isTextOnly
320
318
  }, text.toLocaleUpperCase())));
321
319
  });
322
- var getJdenticonHref = (value, size) => `data:image/svg+xml;utf8,${encodeURIComponent(toSvg(value, size === "px" ? 1 : size * 4, {
323
- padding: 0
324
- }))}`;
325
- var useJdenticonHref = (value, size) => {
326
- return useMemo(() => getJdenticonHref(value, size), [
327
- value
328
- ]);
329
- };
330
320
  var Avatar = {
331
321
  Root: AvatarRoot,
332
322
  Frame: AvatarFrame,
@@ -511,6 +501,9 @@ var Button = /* @__PURE__ */ forwardRef6(({ classNames, children, density: props
511
501
  return /* @__PURE__ */ React7.createElement(Root3, {
512
502
  ref,
513
503
  ...props,
504
+ "data-variant": variant,
505
+ "data-density": density,
506
+ "data-props": inGroup ? "grouped" : "",
514
507
  className: tx("button.root", "button", {
515
508
  variant,
516
509
  inGroup,
@@ -2160,14 +2153,12 @@ export {
2160
2153
  Trans,
2161
2154
  Tree,
2162
2155
  TreeItem,
2163
- getJdenticonHref,
2164
2156
  hasIosKeyboard,
2165
2157
  toLocalizedString,
2166
2158
  useAvatarContext,
2167
2159
  useButtonGroupContext,
2168
2160
  useDensityContext,
2169
2161
  useElevationContext,
2170
- useJdenticonHref,
2171
2162
  useListContext,
2172
2163
  useListItemContext,
2173
2164
  useMainContext,