allaw-ui 2.2.3 → 2.2.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.
@@ -108,7 +108,7 @@ var PrimaryButton = forwardRef(function (_a, ref) {
108
108
  }
109
109
  });
110
110
  }); };
111
- return (React.createElement("button", __assign({ ref: buttonRef, className: "primary-button ".concat(disabled ? "primary-button-disabled" : "primary-button-enabled", " ").concat(fullWidth ? "primary-button-full-width" : "", " ").concat(isButtonLoading ? "primary-button-loading" : "").concat(variant === "warning" ? "primary-button-warning" : ""), disabled: disabled, onClick: handleClick, type: type }, props, { "data-cy": "primary-button" }),
111
+ return (React.createElement("button", __assign({ ref: buttonRef, className: "primary-button ".concat(disabled ? "primary-button-disabled" : "primary-button-enabled", " ").concat(fullWidth ? "primary-button-full-width" : "", " ").concat(isButtonLoading ? "primary-button-loading" : "").concat(variant === "warning" ? "primary-button-warning" : ""), disabled: disabled, onClick: handleClick, type: type }, props),
112
112
  startIcon && (React.createElement("span", { className: "primary-button-icon ".concat(startIconName) })),
113
113
  React.createElement("span", { className: "primary-button-label" }, label),
114
114
  isButtonLoading ? (React.createElement("span", { className: "primary-button-loading-dots" }, loadingDots)) : (endIcon && React.createElement("span", { className: "primary-button-icon ".concat(endIconName) }))));
@@ -15,6 +15,7 @@ export interface TextAreaProps {
15
15
  maxHeight?: number;
16
16
  variant?: "bold" | "semiBold" | "medium";
17
17
  color?: "bleu-allaw" | "mid-grey" | "dark-grey" | "noir" | "pure-white" | "grey-venom" | "venom-grey-dark";
18
+ dataCy?: string;
18
19
  }
19
20
  export interface TextAreaRef {
20
21
  validate: () => boolean;
@@ -6,7 +6,7 @@ import { commonRegex } from "../../../utils/regex";
6
6
  import TinyInfo from "../typography/TinyInfo";
7
7
  import Paragraph from "../typography/Paragraph";
8
8
  var TextArea = forwardRef(function (_a, ref) {
9
- var title = _a.title, _b = _a.style, style = _b === void 0 ? "default" : _b, placeholder = _a.placeholder, _c = _a.isRequired, isRequired = _c === void 0 ? false : _c, validate = _a.validate, onError = _a.onError, onChange = _a.onChange, propValue = _a.value, propError = _a.error, _d = _a.maxHeight, maxHeight = _d === void 0 ? 400 : _d, _e = _a.variant, variant = _e === void 0 ? "medium" : _e, _f = _a.color, color = _f === void 0 ? "noir" : _f;
9
+ var title = _a.title, _b = _a.style, style = _b === void 0 ? "default" : _b, placeholder = _a.placeholder, _c = _a.isRequired, isRequired = _c === void 0 ? false : _c, validate = _a.validate, onError = _a.onError, onChange = _a.onChange, propValue = _a.value, propError = _a.error, _d = _a.maxHeight, maxHeight = _d === void 0 ? 400 : _d, _e = _a.variant, variant = _e === void 0 ? "medium" : _e, _f = _a.color, color = _f === void 0 ? "noir" : _f, dataCy = _a.dataCy;
10
10
  var _g = useState(propValue || ""), value = _g[0], setValue = _g[1];
11
11
  var _h = useState(propError || ""), error = _h[0], setError = _h[1];
12
12
  var _j = useState(false), isTouched = _j[0], setIsTouched = _j[1];
@@ -57,7 +57,7 @@ var TextArea = forwardRef(function (_a, ref) {
57
57
  "\u00A0",
58
58
  "*"))),
59
59
  React.createElement("div", { className: "text-area-container" },
60
- React.createElement("div", { className: "text-area-input" },
60
+ React.createElement("div", { className: "text-area-input", "data-cy": dataCy || "text-area" },
61
61
  React.createElement("textarea", { ref: textareaRef, placeholder: placeholder, className: "text-area-placeholder", value: value, onChange: handleChange, onBlur: handleBlur, style: { maxHeight: "".concat(maxHeight, "px") } })),
62
62
  error && isTouched && (React.createElement("div", { className: "error-message" },
63
63
  React.createElement(TinyInfo, { variant: "medium12", color: "actions-error", text: error }))))));
@@ -8,8 +8,8 @@ var ProgressBar = function (_a) {
8
8
  var progressWidth = constrainedCurrentStep === 0 ? 0 : (constrainedCurrentStep / steps) * 100;
9
9
  var noIconsMargin = !startIcon && !endIcon ? "0px" : "0 10px";
10
10
  return (React.createElement("div", { className: "progress-bar-container" },
11
- isWrapperProgressBar && React.createElement("div", { className: "progress-bar-icon-container" }, startIcon && (React.createElement("button", { className: "progress-bar-chevron", onClick: onStartIconClick },
12
- React.createElement("i", { className: "allaw-icon-chevron-left" })))),
11
+ isWrapperProgressBar && (React.createElement("div", { className: "progress-bar-icon-container" }, startIcon && (React.createElement("button", { className: "progress-bar-chevron", onClick: onStartIconClick },
12
+ React.createElement("i", { className: "allaw-icon-chevron-left" }))))),
13
13
  React.createElement("div", { className: "progress-bar-background ".concat(showProgressBar ? "" : "hidden-content"), style: {
14
14
  height: isWrapperProgressBar ? "6px" : "8px",
15
15
  width: startIcon ? "calc(100% - 32px)" : "100%",
@@ -19,7 +19,7 @@ var ProgressBar = function (_a) {
19
19
  width: "".concat(progressWidth, "%"),
20
20
  height: isWrapperProgressBar ? "6px" : "8px",
21
21
  } })),
22
- endIcon && (React.createElement("button", { className: "progress-bar-close", onClick: onEndIconClick },
22
+ endIcon && (React.createElement("button", { className: "progress-bar-close", onClick: onEndIconClick, "data-cy": "close-stepper" },
23
23
  React.createElement("i", { className: "allaw-icon-close" })))));
24
24
  };
25
25
  export default ProgressBar;
@@ -155,7 +155,7 @@ function ComboBox(_a, ref) {
155
155
  "\u00A0",
156
156
  "*")))),
157
157
  React.createElement("div", { ref: inputContainerRef, className: "combo-box-input-container" },
158
- React.createElement("input", { ref: inputRef, className: "combo-box ".concat(isOpen ? "combo-box-pressed" : "combo-box-default", " ").concat(isHovered ? "combo-box-hovered" : ""), placeholder: placeholder, value: inputValue, onChange: handleInputChange, onFocus: handleInputFocus, style: { width: "100%" } }),
158
+ React.createElement("input", { "data-cy": "combo-box", ref: inputRef, className: "combo-box ".concat(isOpen ? "combo-box-pressed" : "combo-box-default", " ").concat(isHovered ? "combo-box-hovered" : ""), placeholder: placeholder, value: inputValue, onChange: handleInputChange, onFocus: handleInputFocus, style: { width: "100%" } }),
159
159
  React.createElement("div", { ref: chevronRef, className: "combo-box-chevron ".concat(isHovered ? "combo-box-hovered" : ""), onClick: handleChevronClick },
160
160
  React.createElement("i", { className: "allaw-icon-".concat(isInputValid ? "chevron-down" : "close") }))),
161
161
  isOpen &&
@@ -2,6 +2,7 @@ import React from "react";
2
2
  import { ParagraphProps } from "../../atoms/typography/Paragraph";
3
3
  import "./CheckboxForm.css";
4
4
  export interface CheckboxFormProps {
5
+ id?: string;
5
6
  checked?: boolean;
6
7
  onChange?: (checked: boolean) => void;
7
8
  color?: ParagraphProps["color"];
@@ -3,8 +3,8 @@ import Checkbox from "../../atoms/checkboxes/Checkbox";
3
3
  import Paragraph from "../../atoms/typography/Paragraph";
4
4
  import "./CheckboxForm.css";
5
5
  var CheckboxForm = function (_a) {
6
- var _b = _a.checked, checked = _b === void 0 ? false : _b, onChange = _a.onChange, _c = _a.color, color = _c === void 0 ? "noir" : _c, label = _a.label, _d = _a.isRequired, isRequired = _d === void 0 ? false : _d, linkText = _a.linkText, linkUrl = _a.linkUrl, onLinkClick = _a.onLinkClick, _e = _a.size, size = _e === void 0 ? "default" : _e, _f = _a.style, style = _f === void 0 ? "default" : _f, _g = _a.markType, markType = _g === void 0 ? "cross" : _g;
7
- var checkboxId = "checkbox-".concat(Math.random().toString(36).substr(2, 9));
6
+ var id = _a.id, _b = _a.checked, checked = _b === void 0 ? false : _b, onChange = _a.onChange, _c = _a.color, color = _c === void 0 ? "noir" : _c, label = _a.label, _d = _a.isRequired, isRequired = _d === void 0 ? false : _d, linkText = _a.linkText, linkUrl = _a.linkUrl, onLinkClick = _a.onLinkClick, _e = _a.size, size = _e === void 0 ? "default" : _e, _f = _a.style, style = _f === void 0 ? "default" : _f, _g = _a.markType, markType = _g === void 0 ? "cross" : _g;
7
+ var checkboxId = id || "checkbox-".concat(Math.random().toString(36).substr(2, 9));
8
8
  var handleCheckboxChange = function (checked) {
9
9
  if (onChange) {
10
10
  onChange(checked);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "allaw-ui",
3
- "version": "2.2.3",
3
+ "version": "2.2.5",
4
4
  "description": "Composants UI pour l'application Allaw",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.esm.js",