@simplybusiness/mobius 5.31.7 → 5.31.9
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/CHANGELOG.md +13 -0
- package/dist/cjs/index.js +7 -2
- package/dist/cjs/tsconfig.tsbuildinfo +1 -1
- package/dist/esm/index.js +7 -2
- package/dist/types/src/components/Alert/Alert.d.ts +1 -1
- package/dist/types/src/components/DateField/DateField.stories.d.ts +1 -0
- package/dist/types/src/components/NumberField/NumberField.stories.d.ts +1 -0
- package/dist/types/src/components/TextField/TextField.stories.d.ts +1 -0
- package/package.json +2 -2
- package/src/components/Alert/Alert.test.tsx +14 -0
- package/src/components/Alert/Alert.tsx +20 -3
- package/src/components/DateField/DateField.mdx +4 -0
- package/src/components/DateField/DateField.stories.tsx +9 -0
- package/src/components/Icon/Icon.stories.tsx +1 -1
- package/src/components/NumberField/NumberField.mdx +6 -2
- package/src/components/NumberField/NumberField.stories.tsx +9 -0
- package/src/components/TextField/TextField.mdx +5 -1
- package/src/components/TextField/TextField.stories.tsx +14 -2
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,18 @@
|
|
|
1
1
|
# Changelog
|
|
2
2
|
|
|
3
|
+
## 5.31.9
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- 3964fcb: Allow alert atom to receive any variant string, using default info
|
|
8
|
+
|
|
9
|
+
## 5.31.8
|
|
10
|
+
|
|
11
|
+
### Patch Changes
|
|
12
|
+
|
|
13
|
+
- Updated dependencies [619f6b8]
|
|
14
|
+
- @simplybusiness/icons@4.31.2
|
|
15
|
+
|
|
3
16
|
## 5.31.7
|
|
4
17
|
|
|
5
18
|
### Patch Changes
|
package/dist/cjs/index.js
CHANGED
|
@@ -1892,17 +1892,22 @@ var import_icons4 = require("@simplybusiness/icons");
|
|
|
1892
1892
|
var import_dedupe11 = __toESM(require("classnames/dedupe"));
|
|
1893
1893
|
var import_react27 = require("react");
|
|
1894
1894
|
var import_jsx_runtime14 = require("react/jsx-runtime");
|
|
1895
|
+
function isAlertVariant(value) {
|
|
1896
|
+
return value === "info" || value === "success" || value === "warning" || value === "error";
|
|
1897
|
+
}
|
|
1895
1898
|
var Alert = (0, import_react27.forwardRef)(
|
|
1896
1899
|
(props, ref) => {
|
|
1897
1900
|
const {
|
|
1898
1901
|
elementType: Element = "div",
|
|
1899
|
-
variant
|
|
1902
|
+
variant: variantProp,
|
|
1900
1903
|
show = true,
|
|
1901
1904
|
header,
|
|
1902
1905
|
children,
|
|
1903
1906
|
...otherProps
|
|
1904
1907
|
} = props;
|
|
1905
1908
|
if (!show) return null;
|
|
1909
|
+
const variant = variantProp && isAlertVariant(variantProp) ? variantProp : "info";
|
|
1910
|
+
const colorValue = variant === "success" ? `var(--color-valid)` : `var(--color-${variant})`;
|
|
1906
1911
|
const classes = (0, import_dedupe11.default)(
|
|
1907
1912
|
"mobius",
|
|
1908
1913
|
"mobius-alert",
|
|
@@ -1925,7 +1930,7 @@ var Alert = (0, import_react27.forwardRef)(
|
|
|
1925
1930
|
const iconClasses = (0, import_dedupe11.default)("mobius", "mobius-alert__icon");
|
|
1926
1931
|
const contentClasses = (0, import_dedupe11.default)("mobius", "mobius-alert__content");
|
|
1927
1932
|
return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(Element, { ref, role: "alert", ...otherProps, className: classes, children: [
|
|
1928
|
-
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: iconClasses, children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Icon, { icon: icon[variant] }) }),
|
|
1933
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: iconClasses, children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Icon, { icon: icon[variant], color: colorValue }) }),
|
|
1929
1934
|
/* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { children: [
|
|
1930
1935
|
header && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("p", { className: headerClasses, children: header }),
|
|
1931
1936
|
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: contentClasses, children })
|