@scm-manager/ui-forms 2.42.4-20230215-174021 → 2.42.4-20230221-101201

package/.turbo/turbo-build.log

@@ -1,4 +1,4 @@
-@scm-manager/ui-forms:build: cache hit, replaying output e6c3d832906f6750
+@scm-manager/ui-forms:build: cache hit, replaying output a28f963112c9fdc8
 @scm-manager/ui-forms:build: $ tsup ./src/index.ts -d build --format esm,cjs --dts
 @scm-manager/ui-forms:build: CLI Building entry: ./src/index.ts
 @scm-manager/ui-forms:build: CLI Using tsconfig: tsconfig.json
@@ -6,10 +6,10 @@
 @scm-manager/ui-forms:build: CLI Target: node14
 @scm-manager/ui-forms:build: ESM Build start
 @scm-manager/ui-forms:build: CJS Build start
-@scm-manager/ui-forms:build: ESM build/index.mjs 29.75 KB
-@scm-manager/ui-forms:build: ESM ⚡️ Build success in 422ms
-@scm-manager/ui-forms:build: CJS build/index.js 34.38 KB
-@scm-manager/ui-forms:build: CJS ⚡️ Build success in 376ms
+@scm-manager/ui-forms:build: ESM build/index.mjs 30.10 KB
+@scm-manager/ui-forms:build: ESM ⚡️ Build success in 134ms
+@scm-manager/ui-forms:build: CJS build/index.js 34.77 KB
+@scm-manager/ui-forms:build: CJS ⚡️ Build success in 117ms
 @scm-manager/ui-forms:build: DTS Build start
-@scm-manager/ui-forms:build: DTS ⚡️ Build success in 30060ms
+@scm-manager/ui-forms:build: DTS ⚡️ Build success in 18786ms
 @scm-manager/ui-forms:build: DTS build/index.d.ts 25.09 KB

package/build/index.js

@@ -247,17 +247,22 @@ var Help = ({ text, className }) => /* @__PURE__ */ import_react9.default.create
 var Help_default = Help;
 
 // src/input/InputField.tsx
+var import_ui_components3 = require("@scm-manager/ui-components");
 var InputField = import_react10.default.forwardRef(
-  ({ label, helpText, error, className, ...props }, ref) => {
+  ({ label, helpText, error, className, id, ...props }, ref) => {
+    const inputId = (0, import_ui_components3.useGeneratedId)(id ?? props.testId);
     const variant = error ? "danger" : void 0;
     return /* @__PURE__ */ import_react10.default.createElement(Field_default, {
       className
-    }, /* @__PURE__ */ import_react10.default.createElement(Label_default, null, label, helpText ? /* @__PURE__ */ import_react10.default.createElement(Help_default, {
+    }, /* @__PURE__ */ import_react10.default.createElement(Label_default, {
+      htmlFor: inputId
+    }, label, helpText ? /* @__PURE__ */ import_react10.default.createElement(Help_default, {
       className: "ml-1",
       text: helpText
     }) : null), /* @__PURE__ */ import_react10.default.createElement(Control_default, null, /* @__PURE__ */ import_react10.default.createElement(Input_default, {
       variant,
       ref,
+      id: inputId,
       ...props
     })), error ? /* @__PURE__ */ import_react10.default.createElement(FieldMessage_default, {
       variant
@@ -334,7 +339,7 @@ var import_react14 = __toESM(require("react"));
 
 // src/checkbox/Checkbox.tsx
 var import_react13 = __toESM(require("react"));
-var import_ui_components3 = require("@scm-manager/ui-components");
+var import_ui_components4 = require("@scm-manager/ui-components");
 var Checkbox = import_react13.default.forwardRef(
   ({ readOnly, label, value, name, checked, defaultChecked, defaultValue, testId, helpText, ...props }, ref) => /* @__PURE__ */ import_react13.default.createElement("label", {
     className: "checkbox",
@@ -356,7 +361,7 @@ var Checkbox = import_react13.default.forwardRef(
     checked,
     defaultChecked,
     ...props,
-    ...(0, import_ui_components3.createAttributesForTesting)(testId),
+    ...(0, import_ui_components4.createAttributesForTesting)(testId),
     disabled: true
   })) : /* @__PURE__ */ import_react13.default.createElement("input", {
     type: "checkbox",
@@ -368,7 +373,7 @@ var Checkbox = import_react13.default.forwardRef(
     checked,
     defaultChecked,
     ...props,
-    ...(0, import_ui_components3.createAttributesForTesting)(testId)
+    ...(0, import_ui_components4.createAttributesForTesting)(testId)
   }), label, helpText ? /* @__PURE__ */ import_react13.default.createElement(Help_default, {
     className: "ml-1",
     text: helpText
@@ -502,14 +507,14 @@ var import_react18 = __toESM(require("react"));
 // src/select/Select.tsx
 var import_react17 = __toESM(require("react"));
 var import_classnames7 = __toESM(require("classnames"));
-var import_ui_components4 = require("@scm-manager/ui-components");
+var import_ui_components5 = require("@scm-manager/ui-components");
 var Select = import_react17.default.forwardRef(
   ({ variant, children, className, options, testId, ...props }, ref) => /* @__PURE__ */ import_react17.default.createElement("div", {
     className: (0, import_classnames7.default)("select", { "is-multiple": props.multiple }, createVariantClass(variant), className)
   }, /* @__PURE__ */ import_react17.default.createElement("select", {
     ref,
     ...props,
-    ...(0, import_ui_components4.createAttributesForTesting)(testId)
+    ...(0, import_ui_components5.createAttributesForTesting)(testId)
   }, options ? options.map((option) => /* @__PURE__ */ import_react17.default.createElement("option", {
     ...option,
     key: option.value
@@ -518,15 +523,20 @@ var Select = import_react17.default.forwardRef(
 var Select_default = Select;
 
 // src/select/SelectField.tsx
+var import_ui_components6 = require("@scm-manager/ui-components");
 var SelectField = import_react18.default.forwardRef(
-  ({ label, helpText, error, className, ...props }, ref) => {
+  ({ label, helpText, error, className, id, ...props }, ref) => {
+    const selectId = (0, import_ui_components6.useGeneratedId)(id ?? props.testId);
     const variant = error ? "danger" : void 0;
     return /* @__PURE__ */ import_react18.default.createElement(Field_default, {
       className
-    }, /* @__PURE__ */ import_react18.default.createElement(Label_default, null, label, helpText ? /* @__PURE__ */ import_react18.default.createElement(Help_default, {
+    }, /* @__PURE__ */ import_react18.default.createElement(Label_default, {
+      htmlFor: selectId
+    }, label, helpText ? /* @__PURE__ */ import_react18.default.createElement(Help_default, {
       className: "ml-1",
       text: helpText
     }) : null), /* @__PURE__ */ import_react18.default.createElement(Control_default, null, /* @__PURE__ */ import_react18.default.createElement(Select_default, {
+      id: selectId,
       variant,
       ref,
       ...props
@@ -752,12 +762,12 @@ var AddListEntryForm_default = AddListEntryForm;
 
 // src/ConfigurationForm.tsx
 var import_ui_api = require("@scm-manager/ui-api");
-var import_ui_components5 = require("@scm-manager/ui-components");
+var import_ui_components7 = require("@scm-manager/ui-components");
 var import_react25 = __toESM(require("react"));
 function ConfigurationForm({ link, translationPath, children }) {
   const { initialConfiguration, isReadOnly, update, isLoading } = (0, import_ui_api.useConfigLink)(link);
   if (isLoading || !initialConfiguration) {
-    return /* @__PURE__ */ import_react25.default.createElement(import_ui_components5.Loading, null);
+    return /* @__PURE__ */ import_react25.default.createElement(import_ui_components7.Loading, null);
   }
   return /* @__PURE__ */ import_react25.default.createElement(Form_default, {
     onSubmit: update,

package/build/index.mjs

@@ -211,17 +211,22 @@ var Help = ({ text, className }) => /* @__PURE__ */ React9.createElement(Tooltip
 var Help_default = Help;
 
 // src/input/InputField.tsx
+import { useGeneratedId } from "@scm-manager/ui-components";
 var InputField = React10.forwardRef(
-  ({ label, helpText, error, className, ...props }, ref) => {
+  ({ label, helpText, error, className, id, ...props }, ref) => {
+    const inputId = useGeneratedId(id ?? props.testId);
     const variant = error ? "danger" : void 0;
     return /* @__PURE__ */ React10.createElement(Field_default, {
       className
-    }, /* @__PURE__ */ React10.createElement(Label_default, null, label, helpText ? /* @__PURE__ */ React10.createElement(Help_default, {
+    }, /* @__PURE__ */ React10.createElement(Label_default, {
+      htmlFor: inputId
+    }, label, helpText ? /* @__PURE__ */ React10.createElement(Help_default, {
       className: "ml-1",
       text: helpText
     }) : null), /* @__PURE__ */ React10.createElement(Control_default, null, /* @__PURE__ */ React10.createElement(Input_default, {
       variant,
       ref,
+      id: inputId,
       ...props
     })), error ? /* @__PURE__ */ React10.createElement(FieldMessage_default, {
       variant
@@ -482,15 +487,20 @@ var Select = React17.forwardRef(
 var Select_default = Select;
 
 // src/select/SelectField.tsx
+import { useGeneratedId as useGeneratedId2 } from "@scm-manager/ui-components";
 var SelectField = React18.forwardRef(
-  ({ label, helpText, error, className, ...props }, ref) => {
+  ({ label, helpText, error, className, id, ...props }, ref) => {
+    const selectId = useGeneratedId2(id ?? props.testId);
     const variant = error ? "danger" : void 0;
     return /* @__PURE__ */ React18.createElement(Field_default, {
       className
-    }, /* @__PURE__ */ React18.createElement(Label_default, null, label, helpText ? /* @__PURE__ */ React18.createElement(Help_default, {
+    }, /* @__PURE__ */ React18.createElement(Label_default, {
+      htmlFor: selectId
+    }, label, helpText ? /* @__PURE__ */ React18.createElement(Help_default, {
       className: "ml-1",
       text: helpText
     }) : null), /* @__PURE__ */ React18.createElement(Control_default, null, /* @__PURE__ */ React18.createElement(Select_default, {
+      id: selectId,
       variant,
       ref,
       ...props

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@scm-manager/ui-forms",
   "private": false,
-  "version": "2.42.4-20230215-174021",
+  "version": "2.42.4-20230221-101201",
   "main": "build/index.js",
   "types": "build/index.d.ts",
   "module": "build/index.mjs",
@@ -16,7 +16,7 @@
     "@scm-manager/eslint-config": "^2.16.0",
     "@scm-manager/prettier-config": "^2.10.1",
     "@scm-manager/tsconfig": "^2.13.0",
-    "@scm-manager/ui-styles": "2.42.4-20230215-174021",
+    "@scm-manager/ui-styles": "2.42.4-20230221-101201",
     "@storybook/addon-actions": "^6.5.10",
     "@storybook/addon-essentials": "^6.5.10",
     "@storybook/addon-interactions": "^6.5.10",
@@ -32,7 +32,7 @@
     "tsup": "^6.2.3"
   },
   "peerDependencies": {
-    "@scm-manager/ui-components": "2.42.4-20230215-174021",
+    "@scm-manager/ui-components": "2.42.4-20230221-101201",
     "classnames": "^2.3.1",
     "react": "17",
     "react-hook-form": "7",
@@ -41,9 +41,9 @@
     "styled-components": "5"
   },
   "dependencies": {
-    "@scm-manager/ui-buttons": "2.42.4-20230215-174021",
-    "@scm-manager/ui-overlays": "2.42.4-20230215-174021",
-    "@scm-manager/ui-api": "2.42.4-20230215-174021"
+    "@scm-manager/ui-buttons": "2.42.4-20230221-101201",
+    "@scm-manager/ui-overlays": "2.42.4-20230221-101201",
+    "@scm-manager/ui-api": "2.42.4-20230221-101201"
   },
   "prettier": "@scm-manager/prettier-config",
   "eslintConfig": {

package/src/input/InputField.tsx

@@ -29,6 +29,7 @@ import Label from "../base/label/Label";
 import FieldMessage from "../base/field-message/FieldMessage";
 import Input from "./Input";
 import Help from "../base/help/Help";
+import { useGeneratedId } from "@scm-manager/ui-components";
 
 type InputFieldProps = {
   label: string;
@@ -41,16 +42,17 @@ type InputFieldProps = {
  * @see https://bulma.io/documentation/form/input/
  */
 const InputField = React.forwardRef<HTMLInputElement, InputFieldProps>(
-  ({ label, helpText, error, className, ...props }, ref) => {
+  ({ label, helpText, error, className, id, ...props }, ref) => {
+    const inputId = useGeneratedId(id ?? props.testId);
     const variant = error ? "danger" : undefined;
     return (
       <Field className={className}>
-        <Label>
+        <Label htmlFor={inputId}>
           {label}
           {helpText ? <Help className="ml-1" text={helpText} /> : null}
         </Label>
         <Control>
-          <Input variant={variant} ref={ref} {...props}></Input>
+          <Input variant={variant} ref={ref} id={inputId} {...props}></Input>
         </Control>
         {error ? <FieldMessage variant={variant}>{error}</FieldMessage> : null}
       </Field>

package/src/select/SelectField.tsx

@@ -29,6 +29,7 @@ import Label from "../base/label/Label";
 import FieldMessage from "../base/field-message/FieldMessage";
 import Help from "../base/help/Help";
 import Select from "./Select";
+import { useGeneratedId } from "@scm-manager/ui-components";
 
 type Props = {
   label: string;
@@ -40,16 +41,17 @@ type Props = {
  * @see https://bulma.io/documentation/form/select/
  */
 const SelectField = React.forwardRef<HTMLSelectElement, Props>(
-  ({ label, helpText, error, className, ...props }, ref) => {
+  ({ label, helpText, error, className, id, ...props }, ref) => {
+    const selectId = useGeneratedId(id ?? props.testId);
     const variant = error ? "danger" : undefined;
     return (
       <Field className={className}>
-        <Label>
+        <Label htmlFor={selectId}>
           {label}
           {helpText ? <Help className="ml-1" text={helpText} /> : null}
         </Label>
         <Control>
-          <Select variant={variant} ref={ref} {...props}></Select>
+          <Select id={selectId} variant={variant} ref={ref} {...props}></Select>
         </Control>
         {error ? <FieldMessage variant={variant}>{error}</FieldMessage> : null}
       </Field>