design-zystem 1.0.306 → 1.0.308
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.
- package/dist/index.d.mts +1 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.js +54 -28
- package/dist/index.mjs +54 -28
- package/package.json +1 -1
package/dist/index.d.mts
CHANGED
package/dist/index.d.ts
CHANGED
package/dist/index.js
CHANGED
|
@@ -1797,7 +1797,8 @@ var pushToast = (type, message, options = {}) => {
|
|
|
1797
1797
|
type,
|
|
1798
1798
|
message,
|
|
1799
1799
|
title: options.title,
|
|
1800
|
-
timeOut: (_a = options.timeOut) != null ? _a : DEFAULT_TIMEOUT_BY_TYPE[type]
|
|
1800
|
+
timeOut: (_a = options.timeOut) != null ? _a : DEFAULT_TIMEOUT_BY_TYPE[type],
|
|
1801
|
+
onClick: options.onClick
|
|
1801
1802
|
}
|
|
1802
1803
|
];
|
|
1803
1804
|
emitChange();
|
|
@@ -1821,33 +1822,50 @@ var ToastCard = ({ toastItem }) => {
|
|
|
1821
1822
|
return () => clearTimeout(dismissTimer);
|
|
1822
1823
|
}, [handleDismiss, toastItem.timeOut]);
|
|
1823
1824
|
const { icon, accent, background } = TOAST[toastItem.type];
|
|
1824
|
-
return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
|
|
1825
|
-
|
|
1826
|
-
|
|
1827
|
-
|
|
1828
|
-
|
|
1829
|
-
|
|
1830
|
-
|
|
1831
|
-
|
|
1832
|
-
|
|
1833
|
-
name: "
|
|
1834
|
-
|
|
1835
|
-
|
|
1836
|
-
|
|
1837
|
-
|
|
1838
|
-
|
|
1839
|
-
|
|
1840
|
-
|
|
1841
|
-
|
|
1842
|
-
|
|
1843
|
-
|
|
1844
|
-
|
|
1845
|
-
|
|
1846
|
-
|
|
1847
|
-
|
|
1848
|
-
|
|
1849
|
-
|
|
1850
|
-
|
|
1825
|
+
return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
|
|
1826
|
+
Card,
|
|
1827
|
+
{
|
|
1828
|
+
$accent: accent,
|
|
1829
|
+
$isExiting: isExiting,
|
|
1830
|
+
$isClickable: !!toastItem.onClick,
|
|
1831
|
+
role: "status",
|
|
1832
|
+
onClick: toastItem.onClick,
|
|
1833
|
+
children: [
|
|
1834
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(IconBadge, { $background: background, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Icon, { name: icon, family: "regular", size: "m", color: accent }) }),
|
|
1835
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(Content, { children: [
|
|
1836
|
+
toastItem.title && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Text, { size: "s", weight: "700", children: toastItem.title }),
|
|
1837
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Text, { size: "s", children: toastItem.message })
|
|
1838
|
+
] }),
|
|
1839
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
1840
|
+
DismissButton,
|
|
1841
|
+
{
|
|
1842
|
+
onClick: (event) => {
|
|
1843
|
+
event.stopPropagation();
|
|
1844
|
+
handleDismiss();
|
|
1845
|
+
},
|
|
1846
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
1847
|
+
Icon,
|
|
1848
|
+
{
|
|
1849
|
+
name: "xmark",
|
|
1850
|
+
family: "regular",
|
|
1851
|
+
size: "s",
|
|
1852
|
+
color: colors.grey_500,
|
|
1853
|
+
"aria-label": "Fermer"
|
|
1854
|
+
}
|
|
1855
|
+
)
|
|
1856
|
+
}
|
|
1857
|
+
),
|
|
1858
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
|
1859
|
+
ProgressBar,
|
|
1860
|
+
{
|
|
1861
|
+
$accent: accent,
|
|
1862
|
+
$timeOut: toastItem.timeOut,
|
|
1863
|
+
$isExiting: isExiting
|
|
1864
|
+
}
|
|
1865
|
+
)
|
|
1866
|
+
]
|
|
1867
|
+
}
|
|
1868
|
+
);
|
|
1851
1869
|
};
|
|
1852
1870
|
var TOAST = {
|
|
1853
1871
|
success: {
|
|
@@ -1896,9 +1914,16 @@ var Card = import_styled_components13.default.div`
|
|
|
1896
1914
|
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.16);
|
|
1897
1915
|
overflow: hidden;
|
|
1898
1916
|
pointer-events: auto;
|
|
1917
|
+
cursor: ${({ $isClickable }) => $isClickable ? "pointer" : "default"};
|
|
1899
1918
|
animation: ${({ $isExiting }) => $isExiting ? slideOut : slideIn} 180ms
|
|
1900
1919
|
ease-out forwards;
|
|
1901
1920
|
`;
|
|
1921
|
+
var DismissButton = import_styled_components13.default.span`
|
|
1922
|
+
position: absolute;
|
|
1923
|
+
top: 10px;
|
|
1924
|
+
right: 10px;
|
|
1925
|
+
cursor: pointer;
|
|
1926
|
+
`;
|
|
1902
1927
|
var IconBadge = import_styled_components13.default.div`
|
|
1903
1928
|
display: flex;
|
|
1904
1929
|
align-items: center;
|
|
@@ -1974,6 +1999,7 @@ var sizeToPx = {
|
|
|
1974
1999
|
var Wrapper2 = import_styled_components15.default.div`
|
|
1975
2000
|
display: inline-flex;
|
|
1976
2001
|
align-items: center;
|
|
2002
|
+
justify-content: center;
|
|
1977
2003
|
gap: ${(p) => p.$gap}px;
|
|
1978
2004
|
|
|
1979
2005
|
padding: ${(p) => p.$padding};
|
package/dist/index.mjs
CHANGED
|
@@ -1656,7 +1656,8 @@ var pushToast = (type, message, options = {}) => {
|
|
|
1656
1656
|
type,
|
|
1657
1657
|
message,
|
|
1658
1658
|
title: options.title,
|
|
1659
|
-
timeOut: (_a = options.timeOut) != null ? _a : DEFAULT_TIMEOUT_BY_TYPE[type]
|
|
1659
|
+
timeOut: (_a = options.timeOut) != null ? _a : DEFAULT_TIMEOUT_BY_TYPE[type],
|
|
1660
|
+
onClick: options.onClick
|
|
1660
1661
|
}
|
|
1661
1662
|
];
|
|
1662
1663
|
emitChange();
|
|
@@ -1680,33 +1681,50 @@ var ToastCard = ({ toastItem }) => {
|
|
|
1680
1681
|
return () => clearTimeout(dismissTimer);
|
|
1681
1682
|
}, [handleDismiss, toastItem.timeOut]);
|
|
1682
1683
|
const { icon, accent, background } = TOAST[toastItem.type];
|
|
1683
|
-
return /* @__PURE__ */ jsxs7(
|
|
1684
|
-
|
|
1685
|
-
|
|
1686
|
-
|
|
1687
|
-
|
|
1688
|
-
|
|
1689
|
-
|
|
1690
|
-
|
|
1691
|
-
|
|
1692
|
-
name: "
|
|
1693
|
-
|
|
1694
|
-
|
|
1695
|
-
|
|
1696
|
-
|
|
1697
|
-
|
|
1698
|
-
|
|
1699
|
-
|
|
1700
|
-
|
|
1701
|
-
|
|
1702
|
-
|
|
1703
|
-
|
|
1704
|
-
|
|
1705
|
-
|
|
1706
|
-
|
|
1707
|
-
|
|
1708
|
-
|
|
1709
|
-
|
|
1684
|
+
return /* @__PURE__ */ jsxs7(
|
|
1685
|
+
Card,
|
|
1686
|
+
{
|
|
1687
|
+
$accent: accent,
|
|
1688
|
+
$isExiting: isExiting,
|
|
1689
|
+
$isClickable: !!toastItem.onClick,
|
|
1690
|
+
role: "status",
|
|
1691
|
+
onClick: toastItem.onClick,
|
|
1692
|
+
children: [
|
|
1693
|
+
/* @__PURE__ */ jsx17(IconBadge, { $background: background, children: /* @__PURE__ */ jsx17(Icon, { name: icon, family: "regular", size: "m", color: accent }) }),
|
|
1694
|
+
/* @__PURE__ */ jsxs7(Content, { children: [
|
|
1695
|
+
toastItem.title && /* @__PURE__ */ jsx17(Text, { size: "s", weight: "700", children: toastItem.title }),
|
|
1696
|
+
/* @__PURE__ */ jsx17(Text, { size: "s", children: toastItem.message })
|
|
1697
|
+
] }),
|
|
1698
|
+
/* @__PURE__ */ jsx17(
|
|
1699
|
+
DismissButton,
|
|
1700
|
+
{
|
|
1701
|
+
onClick: (event) => {
|
|
1702
|
+
event.stopPropagation();
|
|
1703
|
+
handleDismiss();
|
|
1704
|
+
},
|
|
1705
|
+
children: /* @__PURE__ */ jsx17(
|
|
1706
|
+
Icon,
|
|
1707
|
+
{
|
|
1708
|
+
name: "xmark",
|
|
1709
|
+
family: "regular",
|
|
1710
|
+
size: "s",
|
|
1711
|
+
color: colors.grey_500,
|
|
1712
|
+
"aria-label": "Fermer"
|
|
1713
|
+
}
|
|
1714
|
+
)
|
|
1715
|
+
}
|
|
1716
|
+
),
|
|
1717
|
+
/* @__PURE__ */ jsx17(
|
|
1718
|
+
ProgressBar,
|
|
1719
|
+
{
|
|
1720
|
+
$accent: accent,
|
|
1721
|
+
$timeOut: toastItem.timeOut,
|
|
1722
|
+
$isExiting: isExiting
|
|
1723
|
+
}
|
|
1724
|
+
)
|
|
1725
|
+
]
|
|
1726
|
+
}
|
|
1727
|
+
);
|
|
1710
1728
|
};
|
|
1711
1729
|
var TOAST = {
|
|
1712
1730
|
success: {
|
|
@@ -1755,9 +1773,16 @@ var Card = styled13.div`
|
|
|
1755
1773
|
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.16);
|
|
1756
1774
|
overflow: hidden;
|
|
1757
1775
|
pointer-events: auto;
|
|
1776
|
+
cursor: ${({ $isClickable }) => $isClickable ? "pointer" : "default"};
|
|
1758
1777
|
animation: ${({ $isExiting }) => $isExiting ? slideOut : slideIn} 180ms
|
|
1759
1778
|
ease-out forwards;
|
|
1760
1779
|
`;
|
|
1780
|
+
var DismissButton = styled13.span`
|
|
1781
|
+
position: absolute;
|
|
1782
|
+
top: 10px;
|
|
1783
|
+
right: 10px;
|
|
1784
|
+
cursor: pointer;
|
|
1785
|
+
`;
|
|
1761
1786
|
var IconBadge = styled13.div`
|
|
1762
1787
|
display: flex;
|
|
1763
1788
|
align-items: center;
|
|
@@ -1833,6 +1858,7 @@ var sizeToPx = {
|
|
|
1833
1858
|
var Wrapper2 = styled15.div`
|
|
1834
1859
|
display: inline-flex;
|
|
1835
1860
|
align-items: center;
|
|
1861
|
+
justify-content: center;
|
|
1836
1862
|
gap: ${(p) => p.$gap}px;
|
|
1837
1863
|
|
|
1838
1864
|
padding: ${(p) => p.$padding};
|