@mmb-digital/ds-lilly 0.10.7 → 0.10.8

package/dist/ds-lilly.js

@@ -99600,7 +99600,7 @@ var Label2 = function (_a) {
 
 
 var FormGroup2 = function (_a) {
-    var charCounter = _a.charCounter, children = _a.children, disabledTooltip = _a.disabledTooltip, _b = _a.disabledTooltipOffset, disabledTooltipOffset = _b === void 0 ? 6 : _b, disabledTooltipType = _a.disabledTooltipType, error = _a.error, _c = _a.hasError, hasError = _c === void 0 ? false : _c, _d = _a.hasWarning, hasWarning = _d === void 0 ? false : _d, help = _a.help, isDisabled = _a.isDisabled, label = _a.label, labelTooltip = _a.labelTooltip, name = _a.name, theme = _a.theme, warning = _a.warning;
+    var charCounter = _a.charCounter, children = _a.children, disabledTooltip = _a.disabledTooltip, _b = _a.disabledTooltipOffset, disabledTooltipOffset = _b === void 0 ? 6 : _b, disabledTooltipType = _a.disabledTooltipType, error = _a.error, _c = _a.hasError, hasError = _c === void 0 ? false : _c, _d = _a.hasWarning, hasWarning = _d === void 0 ? false : _d, help = _a.help, isDisabled = _a.isDisabled, label = _a.label, labelFor = _a.labelFor, labelTooltip = _a.labelTooltip, name = _a.name, theme = _a.theme, warning = _a.warning;
     return (external_root_React_commonjs2_react_commonjs_react_amd_react_umd_react_default.a.createElement("div", { className: classBinder_cx('f-group2', { 'f-group2--disabled': isDisabled, 'f-group2--error': hasError, 'f-group2--warning': hasWarning }, theme) },
         withDisabledTooltip({
             isDisabled: isDisabled,
@@ -99608,7 +99608,7 @@ var FormGroup2 = function (_a) {
             disabledTooltipOffset: disabledTooltipOffset,
             disabledTooltipType: disabledTooltipType
         })(external_root_React_commonjs2_react_commonjs_react_amd_react_umd_react_default.a.createElement("span", { className: "disabled-tooltip-wrapper" },
-            label && (external_root_React_commonjs2_react_commonjs_react_amd_react_umd_react_default.a.createElement(Label2, { htmlFor: name, identifier: name + "_label", labelTooltip: labelTooltip }, label)),
+            label && (external_root_React_commonjs2_react_commonjs_react_amd_react_umd_react_default.a.createElement(Label2, { htmlFor: labelFor || name, identifier: name + "_label", labelTooltip: labelTooltip }, label)),
             children)),
         charCounter && charCounter.max > 0 && (external_root_React_commonjs2_react_commonjs_react_amd_react_umd_react_default.a.createElement("div", { className: classBinder_cx('f-controlCounter', { 'f-controlCounter--error': charCounter.length > charCounter.max }) }, (charCounter.length || 0) + " / " + charCounter.max)),
         external_root_React_commonjs2_react_commonjs_react_amd_react_umd_react_default.a.createElement("div", { "aria-live": "assertive", className: "f-validationMsg f-validationMsg--invalid", id: name + "_errorMessage" }, error || warning),
@@ -100726,6 +100726,7 @@ var Autocomplete2 = function (_a) {
         help: help,
         isDisabled: isDisabled,
         label: label,
+        labelFor: name + "_button",
         labelTooltip: labelTooltip,
         name: name,
         warning: warning
@@ -100746,7 +100747,7 @@ var Autocomplete2 = function (_a) {
                                 ? isCategorised(items)
                                     ? name + "_option-" + focusedCategoryIndex + "-" + focusedItemIndex
                                     : name + "_option-" + focusedItemIndex
-                                : undefined, "aria-autocomplete": "list", "aria-controls": name + "_list", "aria-labelledby": name + "_label", autoComplete: "off", className: classBinder_cx('f-autocomplete__input'), disabled: isDisabled, id: name + "_input", name: name, placeholder: placeholder, tabIndex: isDropdownVisible ? 0 : -1, type: "text", value: fulltextValue, onChange: handleFulltextChange, onKeyDown: handleFulltextKeyPress }),
+                                : undefined, "aria-autocomplete": "list", "aria-controls": name + "_list", "aria-labelledby": name + "_label", autoComplete: "off", className: classBinder_cx('f-autocomplete__input', { 'u-hide': !isDropdownVisible }), disabled: isDisabled, id: name + "_input", name: name, placeholder: placeholder, tabIndex: isDropdownVisible ? 0 : -1, type: "text", value: fulltextValue, onChange: handleFulltextChange, onKeyDown: handleFulltextKeyPress }),
                         external_root_React_commonjs2_react_commonjs_react_amd_react_umd_react_default.a.createElement("button", { "aria-invalid": !!error, className: classBinder_cx('f-autocomplete__button'), disabled: isDisabled, id: name + "_toggle_button", name: name, tabIndex: -1, type: "button", onClick: toggleDropdown },
                             external_root_React_commonjs2_react_commonjs_react_amd_react_umd_react_default.a.createElement(Icon, { name: "arrowDown", size: "small", theme: "f-control2__selectIcon" })))), onScrollToEnd: handleScrollToEnd, onVisibleChange: handleDropdownVisibilityChange }, renderDropdownContent()))));
 };
@@ -109214,6 +109215,7 @@ var Select2 = function (_a) {
         help: help,
         isDisabled: isDisabled,
         label: label,
+        labelFor: name + "_button",
         labelTooltip: labelTooltip,
         name: name,
         warning: warning

package/dist/types/src/components/Form/FormGroup2/FormGroup2.d.ts

@@ -15,6 +15,8 @@ export interface FormGroup2PropsType extends ComponentPropsType, DisabledTooltip
     isDisabled?: boolean;
     /** Form field label. */
     label?: ReactNode;
+    /** htmlFor attribute for label (name is used by default) */
+    labelFor?: string;
     /** Content of additional label tooltip. */
     labelTooltip?: ReactNode;
     /** Defines counter of maximum characters to be inserted. */
@@ -27,5 +29,5 @@ export interface FormGroup2PropsType extends ComponentPropsType, DisabledTooltip
     /** Warning message shown in component warning state */
     warning?: string;
 }
-export declare const FormGroup2: ({ charCounter, children, disabledTooltip, disabledTooltipOffset, disabledTooltipType, error, hasError, hasWarning, help, isDisabled, label, labelTooltip, name, theme, warning }: FormGroup2PropsType) => JSX.Element;
+export declare const FormGroup2: ({ charCounter, children, disabledTooltip, disabledTooltipOffset, disabledTooltipType, error, hasError, hasWarning, help, isDisabled, label, labelFor, labelTooltip, name, theme, warning }: FormGroup2PropsType) => JSX.Element;
 //# sourceMappingURL=FormGroup2.d.ts.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mmb-digital/ds-lilly",
-  "version": "0.10.7",
+  "version": "0.10.8",
   "description": "MMB LILLY design system",
   "license": "UNLICENSED",
   "sideEffects": false,