@payfit/unity-components 2.35.6 → 2.36.0

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 (3) hide show
  1. package/dist/esm/components/progress-bar/ProgressBar.d.ts +83 -1
  2. package/dist/esm/components/progress-bar/ProgressBar.js +56 -20
  3. package/package.json +7 -7
package/dist/esm/components/progress-bar/ProgressBar.d.ts CHANGED
@@ -1,8 +1,90 @@
1
- interface ProgressBarProps {
1
+ import { VariantProps } from '@payfit/unity-themes';
2
+ import { ProgressBarProps as AriaProgressBarProps } from 'react-aria-components/ProgressBar';
3
+ declare const progressBar: import('tailwind-variants').TVReturnType<{
4
+ variant: {
5
+ success: {
6
+ meter: string;
7
+ };
8
+ primary: {
9
+ meter: string;
10
+ };
11
+ };
12
+ size: {
13
+ small: {
14
+ base: string;
15
+ meter: string;
16
+ };
17
+ large: {
18
+ base: string;
19
+ meter: string;
20
+ };
21
+ };
22
+ isFull: {
23
+ true: {};
24
+ };
25
+ }, {
26
+ base: string;
27
+ meter: string;
28
+ }, undefined, {
29
+ variant: {
30
+ success: {
31
+ meter: string;
32
+ };
33
+ primary: {
34
+ meter: string;
35
+ };
36
+ };
37
+ size: {
38
+ small: {
39
+ base: string;
40
+ meter: string;
41
+ };
42
+ large: {
43
+ base: string;
44
+ meter: string;
45
+ };
46
+ };
47
+ isFull: {
48
+ true: {};
49
+ };
50
+ }, {
51
+ base: string;
52
+ meter: string;
53
+ }, import('tailwind-variants').TVReturnType<{
54
+ variant: {
55
+ success: {
56
+ meter: string;
57
+ };
58
+ primary: {
59
+ meter: string;
60
+ };
61
+ };
62
+ size: {
63
+ small: {
64
+ base: string;
65
+ meter: string;
66
+ };
67
+ large: {
68
+ base: string;
69
+ meter: string;
70
+ };
71
+ };
72
+ isFull: {
73
+ true: {};
74
+ };
75
+ }, {
76
+ base: string;
77
+ meter: string;
78
+ }, undefined, unknown, unknown, undefined>>;
79
+ export interface ProgressBarProps extends AriaProgressBarProps {
2
80
  /** the range of the value*/
3
81
  range?: [min: number, max: number];
4
82
  /** the value of the progression */
5
83
  value: number;
84
+ /** the visual variant of the progress bar fill */
85
+ variant?: VariantProps<typeof progressBar>['variant'];
86
+ /** the size of the progress bar */
87
+ size?: VariantProps<typeof progressBar>['size'];
6
88
  /** an aria-label for the accessibility */
7
89
  'aria-label': string;
8
90
  }
package/dist/esm/components/progress-bar/ProgressBar.js CHANGED
@@ -1,35 +1,71 @@
1
- import { jsx as r } from "react/jsx-runtime";
2
- import { forwardRef as n } from "react";
3
- import { uyTv as d } from "@payfit/unity-themes";
4
- import { ProgressBar as c } from "react-aria-components/ProgressBar";
5
- const f = d({
1
+ import { jsx as e } from "react/jsx-runtime";
2
+ import { forwardRef as y } from "react";
3
+ import { uyTv as f } from "@payfit/unity-themes";
4
+ import { ProgressBar as g } from "react-aria-components/ProgressBar";
5
+ const b = f({
6
6
  slots: {
7
- base: "uy:rounded-150 uy:bg-surface-neutral-disabled uy:h-150 uy:top-[50%] uy:transform uy:translate-y-[-50%] uy:w-full",
8
- meter: "uy:rounded-l-150 uy:absolute uy:h-full uy:top-[50%] uy:transform uy:translate-y-[-50%] uy:bg-surface-success"
7
+ base: "uy:relative uy:bg-surface-neutral-disabled uy:w-full",
8
+ meter: "uy:absolute uy:inset-y-0 uy:left-0"
9
9
  },
10
10
  variants: {
11
- isFull: {
12
- true: {
13
- meter: "uy:rounded-r-150"
11
+ variant: {
12
+ success: {
13
+ meter: "uy:bg-surface-success"
14
+ },
15
+ primary: {
16
+ meter: "uy:bg-surface-primary"
17
+ }
18
+ },
19
+ size: {
20
+ small: {
21
+ base: "uy:h-75 uy:rounded-75",
22
+ meter: "uy:rounded-l-75"
23
+ },
24
+ large: {
25
+ base: "uy:h-150 uy:rounded-150",
26
+ meter: "uy:rounded-l-150"
14
27
  }
28
+ },
29
+ isFull: {
30
+ true: {}
15
31
  }
16
32
  },
33
+ compoundVariants: [
34
+ {
35
+ size: "small",
36
+ isFull: !0,
37
+ class: { meter: "uy:rounded-r-75" }
38
+ },
39
+ {
40
+ size: "large",
41
+ isFull: !0,
42
+ class: { meter: "uy:rounded-r-150" }
43
+ }
44
+ ],
17
45
  defaultVariants: {
46
+ variant: "success",
47
+ size: "large",
18
48
  isFull: !1
19
49
  }
20
- }), p = n(
21
- ({ value: a, range: e = [0, 100], ...u }, l) => {
22
- const [t, s] = e, o = a >= s, { base: i, meter: y } = f({ isFull: o });
23
- return /* @__PURE__ */ r(
24
- c,
50
+ }), p = y(
51
+ ({
52
+ value: r,
53
+ range: a = [0, 100],
54
+ variant: l = "success",
55
+ size: u = "large",
56
+ ...t
57
+ }, i) => {
58
+ const [o, s] = a, m = r >= s, { base: d, meter: c } = b({ isFull: m, variant: l, size: u });
59
+ return /* @__PURE__ */ e(
60
+ g,
25
61
  {
26
- ref: l,
27
- value: a,
28
- minValue: t,
62
+ ref: i,
63
+ value: r,
64
+ minValue: o,
29
65
  maxValue: s,
30
- "aria-label": u["aria-label"],
66
+ "aria-label": t["aria-label"],
31
67
  "data-dd-privacy": "allow",
32
- children: ({ percentage: m }) => /* @__PURE__ */ r("div", { className: i(), children: /* @__PURE__ */ r("div", { className: y(), style: { width: `${m}%` } }) })
68
+ children: ({ percentage: n }) => /* @__PURE__ */ e("div", { className: d(), children: /* @__PURE__ */ e("div", { className: c(), style: { width: `${n}%` } }) })
33
69
  }
34
70
  );
35
71
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@payfit/unity-components",
3
- "version": "2.35.6",
3
+ "version": "2.36.0",
4
4
  "module": "./dist/esm/index.js",
5
5
  "type": "module",
6
6
  "sideEffects": false,
@@ -43,7 +43,7 @@
43
43
  "@hookform/devtools": "4.4.0",
44
44
  "@hookform/resolvers": "5.2.1",
45
45
  "@internationalized/date": "3.12.1",
46
- "@payfit/unity-illustrations": "2.35.6",
46
+ "@payfit/unity-illustrations": "2.36.0",
47
47
  "@radix-ui/react-avatar": "1.1.11",
48
48
  "@radix-ui/react-slot": "1.2.4",
49
49
  "@react-aria/interactions": "3.28.0",
@@ -75,8 +75,8 @@
75
75
  },
76
76
  "peerDependencies": {
77
77
  "@hookform/devtools": "^4",
78
- "@payfit/unity-icons": "2.35.6",
79
- "@payfit/unity-themes": "2.35.6",
78
+ "@payfit/unity-icons": "2.36.0",
79
+ "@payfit/unity-themes": "2.36.0",
80
80
  "@storybook/react-vite": "^10.3.2",
81
81
  "@tanstack/react-query": "^5",
82
82
  "@tanstack/react-router": "^1.131",
@@ -90,9 +90,9 @@
90
90
  "@figma/code-connect": "1.4.3",
91
91
  "@hookform/devtools": "4.4.0",
92
92
  "@internationalized/date": "3.12.1",
93
- "@payfit/unity-icons": "2.35.6",
94
- "@payfit/unity-illustrations": "2.35.6",
95
- "@payfit/unity-themes": "2.35.6",
93
+ "@payfit/unity-icons": "2.36.0",
94
+ "@payfit/unity-illustrations": "2.36.0",
95
+ "@payfit/unity-themes": "2.36.0",
96
96
  "@storybook/addon-a11y": "10.3.5",
97
97
  "@storybook/addon-designs": "11.1.3",
98
98
  "@storybook/addon-docs": "10.3.5",