@payfit/unity-components 2.64.3 → 2.64.5

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 (24) hide show
  1. package/dist/esm/components/actionable/Actionable.js +21 -20
  2. package/dist/esm/components/avatar/Avatar.js +22 -22
  3. package/dist/esm/components/avatar/AvatarWithTooltip.d.ts +46 -0
  4. package/dist/esm/components/avatar/AvatarWithTooltip.js +39 -0
  5. package/dist/esm/components/avatar/InteractiveAvatar.d.ts +65 -0
  6. package/dist/esm/components/avatar/InteractiveAvatar.js +39 -0
  7. package/dist/esm/components/avatar/parts/AvatarPair.js +1 -1
  8. package/dist/esm/components/avatar-group/AvatarGroup.context.d.ts +10 -0
  9. package/dist/esm/components/avatar-group/AvatarGroup.context.js +18 -0
  10. package/dist/esm/components/avatar-group/AvatarGroup.d.ts +60 -0
  11. package/dist/esm/components/avatar-group/AvatarGroup.js +60 -0
  12. package/dist/esm/components/avatar-group/AvatarGroup.variants.d.ts +32 -0
  13. package/dist/esm/components/avatar-group/AvatarGroup.variants.js +19 -0
  14. package/dist/esm/components/avatar-group/figma/AvatarGroup.figma.d.ts +10 -0
  15. package/dist/esm/components/avatar-group/parts/AvatarGroupCount.d.ts +54 -0
  16. package/dist/esm/components/avatar-group/parts/AvatarGroupCount.js +38 -0
  17. package/dist/esm/components/carousel/parts/CarouselContent.js +3 -3
  18. package/dist/esm/components/segmented-button-group/parts/ToggleButton.js +14 -14
  19. package/dist/esm/components/selectable-button-group/parts/SelectableButton.js +10 -10
  20. package/dist/esm/index.d.ts +4 -0
  21. package/dist/esm/index.js +203 -199
  22. package/i18n/fr-FR.json +1 -0
  23. package/package.json +8 -8
  24. package/src/agent-references/component-catalog.json +67 -0
@@ -1,5 +1,5 @@
1
- import { useCarousel as e } from "../Carousel.context.js";
2
- import { useResponsiveValue as t } from "../../../hooks/use-responsive-value.js";
1
+ import { useResponsiveValue as e } from "../../../hooks/use-responsive-value.js";
2
+ import { useCarousel as t } from "../Carousel.context.js";
3
3
  import { useEffect as n, useState as r } from "react";
4
4
  import { uyTv as i } from "@payfit/unity-themes";
5
5
  import { jsx as a } from "react/jsx-runtime";
@@ -16,7 +16,7 @@ var o = i({ slots: {
16
16
  ]
17
17
  } });
18
18
  function s({ className: i, children: s, itemsPerPage: c, gap: l, trackPadding: u, trackOffset: d = 0 }) {
19
- let { carouselRef: f, a11yIds: p, api: m } = e(), { root: h, track: g } = o(), [_, v] = r(!1), y = t(c), b = t(l), x = t(d), S = t(u?.start), C = t(u?.end);
19
+ let { carouselRef: f, a11yIds: p, api: m } = t(), { root: h, track: g } = o(), [_, v] = r(!1), y = e(c), b = e(l), x = e(d), S = e(u?.start), C = e(u?.end);
20
20
  return n(() => {
21
21
  if (!m) return;
22
22
  let e = () => {
@@ -3,11 +3,11 @@ import { Spinner as t } from "../../spinner/Spinner.js";
3
3
  import { SegmentedButtonGroupContext as n } from "../SegmentedButtonGroups.context.js";
4
4
  import { forwardRef as r, useContext as i, useRef as a } from "react";
5
5
  import { uyTv as o } from "@payfit/unity-themes";
6
- import { Fragment as s, jsx as c, jsxs as l } from "react/jsx-runtime";
7
- import { useIntl as u } from "react-intl";
8
- import { mergeProps as d } from "react-aria/mergeProps";
9
- import { useRadio as f } from "react-aria/useRadioGroup";
10
- import { useFocusRing as p } from "react-aria/useFocusRing";
6
+ import { useFocusRing as s } from "react-aria/useFocusRing";
7
+ import { Fragment as c, jsx as l, jsxs as u } from "react/jsx-runtime";
8
+ import { useIntl as d } from "react-intl";
9
+ import { mergeProps as f } from "react-aria/mergeProps";
10
+ import { useRadio as p } from "react-aria/useRadioGroup";
11
11
  import { VisuallyHidden as m } from "react-aria/VisuallyHidden";
12
12
  //#region src/components/segmented-button-group/parts/ToggleButton.tsx
13
13
  var h = o({
@@ -62,40 +62,40 @@ var h = o({
62
62
  isLoading: !1,
63
63
  hasPrefixIcon: !1
64
64
  }
65
- }), g = ({ intl: n, children: r, isLoading: i, prefixIcon: a, isSelected: o }) => i ? /* @__PURE__ */ c(t, {
65
+ }), g = ({ intl: n, children: r, isLoading: i, prefixIcon: a, isSelected: o }) => i ? /* @__PURE__ */ l(t, {
66
66
  label: n.formatMessage({
67
67
  id: "unity:component:common:loading:label",
68
68
  defaultMessage: "Loading..."
69
69
  }),
70
70
  color: "inherit",
71
71
  size: "small"
72
- }) : /* @__PURE__ */ l(s, { children: [a ? /* @__PURE__ */ c(e, {
72
+ }) : /* @__PURE__ */ u(c, { children: [a ? /* @__PURE__ */ l(e, {
73
73
  src: o ? `${a}Filled` : `${a}Outlined`,
74
74
  color: o ? "content.neutral" : "content.neutral.low",
75
75
  role: "presentation"
76
76
  }) : null, r] }), _ = r((e, t) => {
77
- let { children: r, value: o, prefixIcon: s, isLoading: _ } = e, { state: v } = i(n), y = a(null), { inputProps: b } = f(e, v, y), { focusProps: x, isFocusVisible: S } = p(), C = u(), w = v.selectedValue === o, { base: T, wrapper: E } = h({
77
+ let { children: r, value: o, prefixIcon: c, isLoading: _ } = e, { state: v } = i(n), y = a(null), { inputProps: b } = p(e, v, y), { focusProps: x, isFocusVisible: S } = s(), C = d(), w = v.selectedValue === o, { base: T, wrapper: E } = h({
78
78
  isSelected: w,
79
- hasPrefixIcon: !!s,
79
+ hasPrefixIcon: !!c,
80
80
  isLoading: _,
81
81
  isFocusVisible: S
82
82
  });
83
- return /* @__PURE__ */ l("label", {
83
+ return /* @__PURE__ */ u("label", {
84
84
  ref: t,
85
85
  className: T(),
86
86
  "aria-disabled": _,
87
- children: [/* @__PURE__ */ c(m, { children: /* @__PURE__ */ c("input", {
88
- ...d(b, x),
87
+ children: [/* @__PURE__ */ l(m, { children: /* @__PURE__ */ l("input", {
88
+ ...f(b, x),
89
89
  ref: y,
90
90
  disabled: _
91
- }) }), /* @__PURE__ */ c("span", {
91
+ }) }), /* @__PURE__ */ l("span", {
92
92
  className: E(),
93
93
  children: g({
94
94
  intl: C,
95
95
  children: r,
96
96
  isLoading: _,
97
97
  isSelected: w,
98
- prefixIcon: s
98
+ prefixIcon: c
99
99
  })
100
100
  })]
101
101
  });
@@ -3,9 +3,9 @@ import { Spinner as t } from "../../spinner/Spinner.js";
3
3
  import { SelectableButtonGroupContext as n } from "../SelectableButtonGroup.context.js";
4
4
  import { forwardRef as r, useCallback as i, useContext as a, useRef as o } from "react";
5
5
  import { uyTv as s } from "@payfit/unity-themes";
6
- import { Fragment as c, jsx as l, jsxs as u } from "react/jsx-runtime";
7
- import { mergeProps as d } from "react-aria/mergeProps";
8
- import { useFocusRing as f } from "react-aria/useFocusRing";
6
+ import { useFocusRing as c } from "react-aria/useFocusRing";
7
+ import { Fragment as l, jsx as u, jsxs as d } from "react/jsx-runtime";
8
+ import { mergeProps as f } from "react-aria/mergeProps";
9
9
  import { useToggleButtonGroupItem as p } from "react-aria/useToggleButtonGroup";
10
10
  import { useHover as m } from "react-aria/useHover";
11
11
  //#region src/components/selectable-button-group/parts/SelectableButton.tsx
@@ -43,12 +43,12 @@ var h = s({
43
43
  let { buttonProps: v, isPressed: y, isSelected: b } = p({
44
44
  id: r.value,
45
45
  ...r
46
- }, _, g), { isDisabled: x = !1, isLoading: S = !1, prefixIcon: C, children: w } = r, { hoverProps: T, isHovered: E } = m({ isDisabled: x || S }), { isFocusVisible: D, focusProps: O } = f(), k = i((e) => {
46
+ }, _, g), { isDisabled: x = !1, isLoading: S = !1, prefixIcon: C, children: w } = r, { hoverProps: T, isHovered: E } = m({ isDisabled: x || S }), { isFocusVisible: D, focusProps: O } = c(), k = i((e) => {
47
47
  g.current = e, typeof s == "function" ? s(e) : s && (s.current = e);
48
48
  }, [s]), { base: A, icon: j, label: M } = h({ hasIcon: !!C && !S });
49
- return /* @__PURE__ */ u("button", {
49
+ return /* @__PURE__ */ d("button", {
50
50
  "data-dd-privacy": "allow",
51
- ...d(v, T, O),
51
+ ...f(v, T, O),
52
52
  ref: k,
53
53
  className: A({ className: r.className }),
54
54
  disabled: v.disabled || x || S,
@@ -58,19 +58,19 @@ var h = s({
58
58
  "data-focus-visible": D || void 0,
59
59
  "data-selected": b,
60
60
  "aria-busy": S,
61
- children: [C && !S && /* @__PURE__ */ l(e, {
61
+ children: [C && !S && /* @__PURE__ */ u(e, {
62
62
  src: b ? `${C}Filled` : `${C}Outlined`,
63
63
  role: "presentation",
64
64
  className: j(),
65
65
  size: 20
66
- }), S ? /* @__PURE__ */ u(c, { children: [/* @__PURE__ */ l(t, {
66
+ }), S ? /* @__PURE__ */ d(l, { children: [/* @__PURE__ */ u(t, {
67
67
  label: "Loading",
68
68
  size: "small",
69
69
  color: "inherit"
70
- }), /* @__PURE__ */ l("span", {
70
+ }), /* @__PURE__ */ u("span", {
71
71
  className: "uy:sr-only",
72
72
  children: w
73
- })] }) : /* @__PURE__ */ l("span", {
73
+ })] }) : /* @__PURE__ */ u("span", {
74
74
  className: M(),
75
75
  children: w
76
76
  })]
@@ -20,10 +20,14 @@ export * from './components/autocomplete/Autocomplete.js';
20
20
  export * from './components/autocomplete/parts/AutocompleteItem.js';
21
21
  export * from './components/autocomplete/parts/AutocompleteItemGroup.js';
22
22
  export * from './components/avatar/Avatar.js';
23
+ export * from './components/avatar/AvatarWithTooltip.js';
24
+ export * from './components/avatar/InteractiveAvatar.js';
23
25
  export * from './components/avatar/parts/AvatarFallback.js';
24
26
  export * from './components/avatar/parts/AvatarIcon.js';
25
27
  export * from './components/avatar/parts/AvatarImage.js';
26
28
  export * from './components/avatar/parts/AvatarPair.js';
29
+ export * from './components/avatar-group/AvatarGroup.js';
30
+ export * from './components/avatar-group/parts/AvatarGroupCount.js';
27
31
  export * from './components/avatar/utils.js';
28
32
  export * from './components/badge/Badge.js';
29
33
  export * from './components/badge/parts/BadgeDot.js';