@povio/ui 2.1.3 → 2.1.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.
@@ -10,7 +10,7 @@ const CheckboxCheckmarkIcon = (props) => /* @__PURE__ */ jsx(
10
10
  children: /* @__PURE__ */ jsx(
11
11
  "path",
12
12
  {
13
- stroke: "#F8F8FA",
13
+ stroke: "currentColor",
14
14
  strokeLinecap: "round",
15
15
  strokeLinejoin: "round",
16
16
  strokeWidth: 2,
@@ -10,7 +10,7 @@ const CheckboxIndeterminateIcon = (props) => /* @__PURE__ */ jsx(
10
10
  children: /* @__PURE__ */ jsx(
11
11
  "path",
12
12
  {
13
- stroke: "#F8F8FA",
13
+ stroke: "currentColor",
14
14
  strokeLinecap: "round",
15
15
  strokeLinejoin: "round",
16
16
  strokeWidth: 2,
@@ -10,7 +10,7 @@ const DragIcon = (props) => /* @__PURE__ */ jsx(
10
10
  children: /* @__PURE__ */ jsx(
11
11
  "path",
12
12
  {
13
- fill: "#6D7688",
13
+ fill: "currentColor",
14
14
  d: "M9 19.615q-.666 0-1.14-.474A1.56 1.56 0 0 1 7.384 18q0-.666.474-1.14A1.56 1.56 0 0 1 9 16.384q.666 0 1.14.474.475.475.475 1.141t-.474 1.14A1.56 1.56 0 0 1 9 19.616m6 0q-.666 0-1.14-.474A1.56 1.56 0 0 1 13.384 18q0-.666.474-1.14A1.56 1.56 0 0 1 15 16.384q.666 0 1.14.474.475.475.475 1.141t-.474 1.14a1.56 1.56 0 0 1-1.141.475m-6-6q-.666 0-1.14-.474A1.56 1.56 0 0 1 7.384 12q0-.666.474-1.14A1.56 1.56 0 0 1 9 10.384q.666 0 1.14.474.475.475.475 1.141t-.474 1.14A1.56 1.56 0 0 1 9 13.616m6 0q-.666 0-1.14-.474A1.56 1.56 0 0 1 13.384 12q0-.666.474-1.14A1.56 1.56 0 0 1 15 10.384q.666 0 1.14.474.475.475.475 1.141t-.474 1.14a1.56 1.56 0 0 1-1.141.475m-6-6q-.666 0-1.14-.474A1.56 1.56 0 0 1 7.384 6q0-.666.474-1.14A1.56 1.56 0 0 1 9 4.384q.666 0 1.14.474.475.475.475 1.141t-.474 1.14A1.56 1.56 0 0 1 9 7.616m6 0q-.666 0-1.14-.474A1.56 1.56 0 0 1 13.384 6q0-.666.474-1.14A1.56 1.56 0 0 1 15 4.384q.666 0 1.14.474.475.475.475 1.141t-.474 1.14A1.56 1.56 0 0 1 15 7.616"
15
15
  }
16
16
  )
@@ -485,7 +485,7 @@ const button = cva(["group inline-flex items-center justify-center border border
485
485
  }
486
486
  ],
487
487
  defaultVariants: {
488
- width: "fill",
488
+ width: "hug",
489
489
  color: "primary",
490
490
  variant: "contained",
491
491
  inverted: false
@@ -7,14 +7,14 @@ const checkbox = cva(
7
7
  variants: {
8
8
  variant: {
9
9
  default: [
10
- "m-1 border-interactive-contained-secondary-idle",
10
+ "m-1 border-interactive-outlined-secondary-on-idle",
11
11
  "text-interactive-contained-primary-on-idle",
12
12
  "group-hover:text-interactive-contained-primary-on-hover",
13
13
  "group-pressed:text-interactive-contained-primary-on-pressed",
14
14
  "group-disabled:text-interactive-contained-primary-on-disabled",
15
- "group-disabled:border-interactive-contained-secondary-disabled",
16
- "group-hover:border-interactive-contained-secondary-hover",
17
- "group-pressed:border-interactive-contained-secondary-pressed",
15
+ "group-disabled:border-interactive-outlined-secondary-on-disabled",
16
+ "group-hover:border-interactive-outlined-secondary-on-hover",
17
+ "group-pressed:border-interactive-outlined-secondary-on-pressed",
18
18
  "group-selected:border-interactive-contained-primary-idle",
19
19
  "group-selected:bg-interactive-contained-primary-idle",
20
20
  "group-selected:group-hover:bg-interactive-contained-primary-hover",
@@ -27,7 +27,7 @@ const checkbox = cva(
27
27
  "group-indeterminate:group-hover:border-interactive-contained-primary-hover",
28
28
  "group-indeterminate:group-pressed:bg-interactive-contained-primary-pressed",
29
29
  "group-indeterminate:group-pressed:border-interactive-contained-primary-pressed",
30
- "group-invalid:border-interactive-contained-error-idle",
30
+ "group-invalid:border-interactive-outlined-error-on-idle",
31
31
  "group-focus-visible:outline-interactive-contained-primary-focus"
32
32
  ]
33
33
  }
@@ -136,7 +136,7 @@ const DatePickerInput = ({
136
136
  }
137
137
  ),
138
138
  endFieldProps && /* @__PURE__ */ jsxs(Fragment, { children: [
139
- !((as === "floating" || as === "filter") && hidePlaceholder) && /* @__PURE__ */ jsx("span", { className: "select-none", children: "–" }),
139
+ !((as === "floating" || as === "filter") && hidePlaceholder) && /* @__PURE__ */ jsx("span", { className: clsx("select-none", isDisabled && "text-interactive-text-secondary-disabled"), children: "–" }),
140
140
  /* @__PURE__ */ jsx(
141
141
  DateField,
142
142
  {
@@ -12,10 +12,10 @@ const radio = cva(
12
12
  variants: {
13
13
  variant: {
14
14
  default: [
15
- "border-interactive-contained-secondary-idle",
16
- "group-disabled:border-interactive-contained-secondary-disabled",
17
- "group-hover:border-interactive-contained-secondary-hover",
18
- "group-pressed:border-interactive-contained-secondary-pressed",
15
+ "border-interactive-outlined-secondary-on-idle",
16
+ "group-disabled:border-interactive-outlined-secondary-on-disabled",
17
+ "group-hover:border-interactive-outlined-secondary-on-hover",
18
+ "group-pressed:border-interactive-outlined-secondary-on-pressed",
19
19
  "group-selected:border-interactive-contained-primary-idle",
20
20
  "group-selected:bg-interactive-contained-primary-idle",
21
21
  "group-selected:group-hover:bg-interactive-contained-primary-hover",
@@ -30,7 +30,7 @@ const radio = cva(
30
30
  "group-indeterminate:group-hover:border-interactive-contained-primary-hover",
31
31
  "group-indeterminate:group-pressed:bg-interactive-contained-primary-pressed",
32
32
  "group-indeterminate:group-pressed:border-interactive-contained-primary-pressed",
33
- "group-invalid:border-interactive-contained-error-idle",
33
+ "group-invalid:border-interactive-outlined-error-on-idle",
34
34
  "group-focus-visible:outline-interactive-contained-primary-focus",
35
35
  "before:bg-interactive-contained-primary-on-idle",
36
36
  "group-hover:before:bg-interactive-contained-primary-on-hover",
@@ -32,7 +32,7 @@ const ActionModal = ({
32
32
  size: "title-5",
33
33
  variant: "prominent-1",
34
34
  as: "h2",
35
- className: textAlignClass,
35
+ className: clsx("text-text-default-1", textAlignClass),
36
36
  children: heading
37
37
  }
38
38
  ),
@@ -40,7 +40,7 @@ const ActionModal = ({
40
40
  Typography,
41
41
  {
42
42
  size: "body-3",
43
- className: textAlignClass,
43
+ className: clsx("text-text-default-1", textAlignClass),
44
44
  children: description
45
45
  }
46
46
  )
@@ -1,12 +1,13 @@
1
- import { ToastPosition, ToastOptions as ToastifyToastOptions } from 'react-toastify';
1
+ import { Id, ToastPosition, ToastOptions as ToastifyToastOptions } from 'react-toastify';
2
2
  import { ToastProps } from './Toast';
3
3
  export interface ToastParams extends Omit<ToastProps, "color"> {
4
4
  position?: ToastPosition;
5
5
  }
6
6
  export type ToastOptions = Omit<ToastifyToastOptions, "position" | "data">;
7
7
  export declare const useToast: () => {
8
- successToast: (params: ToastParams, options?: ToastOptions) => void;
9
- errorToast: (params: ToastParams, options?: ToastOptions) => void;
10
- warningToast: (params: ToastParams, options?: ToastOptions) => void;
11
- neutralToast: (params: ToastParams, options?: ToastOptions) => void;
8
+ successToast: (params: ToastParams, options?: ToastOptions) => Id;
9
+ errorToast: (params: ToastParams, options?: ToastOptions) => Id;
10
+ warningToast: (params: ToastParams, options?: ToastOptions) => Id;
11
+ neutralToast: (params: ToastParams, options?: ToastOptions) => Id;
12
+ closeToast: (id: Id) => void;
12
13
  };
@@ -4,7 +4,7 @@ import { toast } from "react-toastify";
4
4
  import { Toast } from "./Toast.js";
5
5
  const useToast = () => {
6
6
  const successToast = useCallback((params, options) => {
7
- toast.success(
7
+ return toast.success(
8
8
  /* @__PURE__ */ jsx(
9
9
  Toast,
10
10
  {
@@ -22,7 +22,7 @@ const useToast = () => {
22
22
  );
23
23
  }, []);
24
24
  const errorToast = useCallback((params, options) => {
25
- toast.error(
25
+ return toast.error(
26
26
  /* @__PURE__ */ jsx(
27
27
  Toast,
28
28
  {
@@ -40,7 +40,7 @@ const useToast = () => {
40
40
  );
41
41
  }, []);
42
42
  const warningToast = useCallback((params, options) => {
43
- toast.warning(
43
+ return toast.warning(
44
44
  /* @__PURE__ */ jsx(
45
45
  Toast,
46
46
  {
@@ -58,7 +58,7 @@ const useToast = () => {
58
58
  );
59
59
  }, []);
60
60
  const neutralToast = useCallback((params, options) => {
61
- toast.info(
61
+ return toast.info(
62
62
  /* @__PURE__ */ jsx(
63
63
  Toast,
64
64
  {
@@ -75,14 +75,18 @@ const useToast = () => {
75
75
  }
76
76
  );
77
77
  }, []);
78
+ const closeToast = useCallback((id) => {
79
+ toast.dismiss(id);
80
+ }, []);
78
81
  return useMemo(
79
82
  () => ({
80
83
  successToast,
81
84
  errorToast,
82
85
  warningToast,
83
- neutralToast
86
+ neutralToast,
87
+ closeToast
84
88
  }),
85
- [successToast, errorToast, warningToast, neutralToast]
89
+ [successToast, errorToast, warningToast, neutralToast, closeToast]
86
90
  );
87
91
  };
88
92
  export {
@@ -45,8 +45,12 @@ var ThemeContext;
45
45
  document.documentElement.classList.remove("dark");
46
46
  if ((!theme || theme === "system") && systemTheme === "dark" || theme === "dark") {
47
47
  document.documentElement.classList.add("dark");
48
+ document.documentElement.style.colorScheme = "dark";
48
49
  } else if (theme === "light") {
49
50
  document.documentElement.classList.add("light");
51
+ document.documentElement.style.colorScheme = "light";
52
+ } else {
53
+ document.documentElement.style.colorScheme = "light";
50
54
  }
51
55
  }, [theme, systemTheme]);
52
56
  const contextValue = useMemo(
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@povio/ui",
3
- "version": "2.1.3",
3
+ "version": "2.1.5",
4
4
  "type": "module",
5
5
  "module": "dist/index.js",
6
6
  "types": "dist/index.d.ts",