kelt-ui-kit-react 1.4.1 → 1.4.2

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.
Files changed (3) hide show
  1. package/dist/index.js +3 -3
  2. package/package.json +1 -1
  3. package/src/form/Form.tsx +66 -62
package/dist/index.js CHANGED
@@ -4136,7 +4136,7 @@ const Rc = Ft(
4136
4136
  getValues: x,
4137
4137
  updateFormValue: y
4138
4138
  })), /* @__PURE__ */ o.jsxs("form", { onSubmit: g, className: i ?? "", children: [
4139
- e.map((p, j) => {
4139
+ /* @__PURE__ */ o.jsx("div", { className: "form-content", children: e.map((p, j) => {
4140
4140
  const O = p.onRequired ? p.onRequired(p.value) : p.required ?? !1, P = p.onDisabled ? p.onDisabled(p.value) : p.disabled ?? !1;
4141
4141
  return /* @__PURE__ */ o.jsxs(
4142
4142
  "div",
@@ -4185,8 +4185,8 @@ const Rc = Ft(
4185
4185
  },
4186
4186
  j
4187
4187
  );
4188
- }),
4189
- /* @__PURE__ */ o.jsx("div", { className: "d-flex justify-content-end", children: !a && /* @__PURE__ */ o.jsx(Wt, { title: t || "submit" }) })
4188
+ }) }),
4189
+ /* @__PURE__ */ o.jsx("div", { className: "d-flex justify-content-end form-footer", children: !a && /* @__PURE__ */ o.jsx(Wt, { title: t || "submit" }) })
4190
4190
  ] });
4191
4191
  }
4192
4192
  ), al = ({
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "kelt-ui-kit-react",
3
3
  "type": "module",
4
- "version": "1.4.1",
4
+ "version": "1.4.2",
5
5
  "private": false,
6
6
  "main": "dist/index.js",
7
7
  "types": "dist/index.d.ts",
package/src/form/Form.tsx CHANGED
@@ -152,68 +152,72 @@ export const DynamicForm = forwardRef(
152
152
 
153
153
  return (
154
154
  <form onSubmit={handleSubmit} className={className ?? ""}>
155
- {initialForm.map((v, key) => {
156
- const required = v.onRequired
157
- ? v.onRequired(v.value)
158
- : v.required ?? false;
159
- const disabled = v.onDisabled
160
- ? v.onDisabled(v.value)
161
- : v.disabled ?? false;
162
-
163
- return (
164
- <div
165
- key={key}
166
- className={`d-flex flex-column ${
167
- v.className ?? ""
168
- } form-group form-group-${v.type}`}
169
- >
170
- {v.label && <label>{v.label}</label>}
171
- {v.icon && <Icon classIcon={v.icon} />}
172
-
173
- {v.type === "select" ? (
174
- <Select
175
- id={v.name}
176
- label={undefined}
177
- name={v.name}
178
- options={v.options ?? []}
179
- disabled={disabled}
180
- multiple={v.multiple}
181
- value={values[v.name] as any}
182
- required={required}
183
- defaultValue={v.value as string | string[]}
184
- placeholder={v.placeholder}
185
- onChangeMultiple={(newValue) =>
186
- handleChangeSelect(newValue, v.name, v)
187
- }
188
- onChange={(newValue) =>
189
- handleChangeSelect(newValue, v.name, v)
190
- }
191
- />
192
- ) : (
193
- <Input
194
- id={v.name}
195
- ref={(el) => (inputRefs.current[v.name] = el)}
196
- name={v.name}
197
- type={v.type}
198
- placeholder={v.placeholder ?? ""}
199
- autoComplete={v.autoComplete ?? "off"}
200
- tabIndex={0}
201
- disabled={disabled}
202
- autoFocus={v.focus ?? false}
203
- required={required}
204
- step={v.step ?? "0.01"}
205
- value={values[v.name] as string | number}
206
- checked={v.type === "checkbox" ? !!values[v.name] : undefined}
207
- onChange={(e: React.ChangeEvent<HTMLInputElement>) =>
208
- handleChangeInput(e, v)
209
- }
210
- onInvalid={v.onInvalid ? v.onInvalid : undefined}
211
- />
212
- )}
213
- </div>
214
- );
215
- })}
216
- <div className="d-flex justify-content-end">
155
+ <div className="form-content">
156
+ {initialForm.map((v, key) => {
157
+ const required = v.onRequired
158
+ ? v.onRequired(v.value)
159
+ : v.required ?? false;
160
+ const disabled = v.onDisabled
161
+ ? v.onDisabled(v.value)
162
+ : v.disabled ?? false;
163
+
164
+ return (
165
+ <div
166
+ key={key}
167
+ className={`d-flex flex-column ${
168
+ v.className ?? ""
169
+ } form-group form-group-${v.type}`}
170
+ >
171
+ {v.label && <label>{v.label}</label>}
172
+ {v.icon && <Icon classIcon={v.icon} />}
173
+
174
+ {v.type === "select" ? (
175
+ <Select
176
+ id={v.name}
177
+ label={undefined}
178
+ name={v.name}
179
+ options={v.options ?? []}
180
+ disabled={disabled}
181
+ multiple={v.multiple}
182
+ value={values[v.name] as any}
183
+ required={required}
184
+ defaultValue={v.value as string | string[]}
185
+ placeholder={v.placeholder}
186
+ onChangeMultiple={(newValue) =>
187
+ handleChangeSelect(newValue, v.name, v)
188
+ }
189
+ onChange={(newValue) =>
190
+ handleChangeSelect(newValue, v.name, v)
191
+ }
192
+ />
193
+ ) : (
194
+ <Input
195
+ id={v.name}
196
+ ref={(el) => (inputRefs.current[v.name] = el)}
197
+ name={v.name}
198
+ type={v.type}
199
+ placeholder={v.placeholder ?? ""}
200
+ autoComplete={v.autoComplete ?? "off"}
201
+ tabIndex={0}
202
+ disabled={disabled}
203
+ autoFocus={v.focus ?? false}
204
+ required={required}
205
+ step={v.step ?? "0.01"}
206
+ value={values[v.name] as string | number}
207
+ checked={
208
+ v.type === "checkbox" ? !!values[v.name] : undefined
209
+ }
210
+ onChange={(e: React.ChangeEvent<HTMLInputElement>) =>
211
+ handleChangeInput(e, v)
212
+ }
213
+ onInvalid={v.onInvalid ? v.onInvalid : undefined}
214
+ />
215
+ )}
216
+ </div>
217
+ );
218
+ })}
219
+ </div>
220
+ <div className="d-flex justify-content-end form-footer">
217
221
  {!hideSubmit && <Button title={title || "submit"} />}
218
222
  </div>
219
223
  </form>