@skalfa/skalfa-component 1.0.27 → 1.0.28

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.
@@ -1,6 +1,6 @@
1
1
  import { ReactNode } from "react";
2
2
  import { ApiType, FormErrorType, FormRegisterType, FormValueType, ValidationRules, DBSchema } from "@utils";
3
- import { InputProps, InputCheckboxProps, InputCurrencyProps, InputDateProps, InputNumberProps, InputRadioProps, SelectProps, InputPasswordProps, InputOtpProps, InputTimeProps, InputImageProps, InputDateTimeProps } from "../";
3
+ import { InputProps, InputCheckboxProps, InputCurrencyProps, InputDateProps, InputNumberProps, InputRadioProps, SelectProps, InputPasswordProps, InputOtpProps, InputTimeProps, InputImageProps, InputDateTimeProps, TextareaProps, InputContentProps } from "../";
4
4
  type formCustomConstructionProps = ({ formControl, values, setValues, setRegister, errors, setErrors, }: {
5
5
  formControl: (name: string) => {
6
6
  register: (regName: string, regValidations?: ValidationRules | undefined) => void;
@@ -42,6 +42,8 @@ type ConstructionMap = {
42
42
  select: SelectProps;
43
43
  "enter-password": InputPasswordProps;
44
44
  otp: InputOtpProps;
45
+ textarea: TextareaProps;
46
+ content: InputContentProps;
45
47
  custom: formCustomConstructionProps;
46
48
  };
47
49
  type TypeKeys = keyof ConstructionMap;
@@ -181,6 +181,8 @@ function FormSupervisionComponent({ title, fields, submitControl, confirmation,
181
181
  "enter-password": __1.InputPasswordComponent,
182
182
  otp: __1.InputOtpComponent,
183
183
  image: __1.InputImageComponent,
184
+ textarea: __1.TextareaComponent,
185
+ content: __1.InputContentComponent,
184
186
  cluster: () => null,
185
187
  custom: () => null,
186
188
  };
@@ -235,7 +237,7 @@ function FormSupervisionComponent({ title, fields, submitControl, confirmation,
235
237
  setValues(updatedValues);
236
238
  };
237
239
  const clusterError = errors?.find((err) => err.name === groupKey || err.name === mapName)?.error;
238
- return ((0, jsx_runtime_1.jsxs)("div", { className: (0, _utils_1.cn)("flex flex-col gap-4", generateColClass(form.col || "12")), children: [label && (0, jsx_runtime_1.jsx)("p", { className: "input-label", children: label }), clusterError && (0, jsx_runtime_1.jsx)("small", { className: "input-error-message", children: clusterError }), group.map((gIndex) => ((0, jsx_runtime_1.jsxs)("div", { className: (0, _utils_1.cn)("relative pr-8", wrap && "p-4 rounded border", className), children: [label && (0, jsx_runtime_1.jsxs)("p", { className: "input-label", children: [label, " ", gIndex + 1] }), tip && (0, jsx_runtime_1.jsx)("small", { className: (0, _utils_1.cn)("input-tip"), children: tip }), (label || tip) && (0, jsx_runtime_1.jsx)("div", { className: "mb-2" }), (0, jsx_runtime_1.jsx)("div", { className: "w-full grid grid-cols-12 gap-4", children: innerForms.map((inner, i) => renderInput(inner, i, `${groupKey}[${gIndex}]`)) }), showDeleteButton && ((0, jsx_runtime_1.jsx)(__1.ButtonComponent, { icon: "solid/times", paint: "danger", variant: "outline", size: "xs", className: (0, _utils_1.cn)("absolute top-10 right-2 translate-x-[50%] -translate-y-[50%]", wrap && "translate-x-0 -translate-y-0 top-1 right-1"), onClick: () => removeGroup(gIndex) }))] }, gIndex))), (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(__1.ButtonComponent, { icon: "solid/plus", label: `${l.base.add ? l.base.add() : "Add"} ${label || mapName}`, variant: "outline", size: "sm", onClick: addGroup }) })] }, key));
240
+ return ((0, jsx_runtime_1.jsxs)("div", { className: (0, _utils_1.cn)("flex flex-col gap-4", generateColClass(form.col || "12")), children: [label && (0, jsx_runtime_1.jsx)("p", { className: "input-label", children: label }), clusterError && (0, jsx_runtime_1.jsx)("small", { className: "input-error-message", children: clusterError }), group.map((gIndex) => ((0, jsx_runtime_1.jsxs)("div", { className: (0, _utils_1.cn)("relative pr-8", wrap && "form-supervision-cluster-item-wrapped", className), children: [label && (0, jsx_runtime_1.jsxs)("p", { className: "input-label", children: [label, " ", gIndex + 1] }), tip && (0, jsx_runtime_1.jsx)("small", { className: (0, _utils_1.cn)("input-tip"), children: tip }), (label || tip) && (0, jsx_runtime_1.jsx)("div", { className: "mb-2" }), (0, jsx_runtime_1.jsx)("div", { className: "w-full grid grid-cols-12 gap-4", children: innerForms.map((inner, i) => renderInput(inner, i, `${groupKey}[${gIndex}]`)) }), showDeleteButton && ((0, jsx_runtime_1.jsx)(__1.ButtonComponent, { icon: "solid/times", paint: "danger", variant: "outline", size: "xs", className: (0, _utils_1.cn)("form-supervision-cluster-remove-btn", wrap && "form-supervision-cluster-remove-btn-wrapped"), onClick: () => removeGroup(gIndex) }))] }, gIndex))), (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(__1.ButtonComponent, { icon: "solid/plus", label: `${l.base.add ? l.base.add() : "Add"} ${label || "Lainnya"}`, variant: "outline", size: "sm", onClick: addGroup }) })] }, key));
239
241
  }
240
242
  if (inputType === "custom") {
241
243
  const customRender = form.construction;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@skalfa/skalfa-component",
3
- "version": "1.0.27",
3
+ "version": "1.0.28",
4
4
  "description": "Reusable UI components for Skalfa App.",
5
5
  "license": "MIT",
6
6
  "keywords": [
@@ -29,6 +29,10 @@ import {
29
29
  InputDatetimeComponent,
30
30
  InputTimeComponent,
31
31
  InputImageComponent,
32
+ TextareaComponent,
33
+ TextareaProps,
34
+ InputContentComponent,
35
+ InputContentProps,
32
36
  } from "../";
33
37
  import { Icon } from "@skalfa/skalfa-icon";
34
38
  import { useLang } from "@skalfa/skalfa-lang";
@@ -85,6 +89,8 @@ type ConstructionMap = {
85
89
  select : SelectProps;
86
90
  "enter-password" : InputPasswordProps;
87
91
  otp : InputOtpProps;
92
+ textarea : TextareaProps;
93
+ content : InputContentProps;
88
94
  custom : formCustomConstructionProps;
89
95
  };
90
96
 
@@ -366,6 +372,8 @@ export function FormSupervisionComponent({
366
372
  "enter-password" : InputPasswordComponent,
367
373
  otp : InputOtpComponent,
368
374
  image : InputImageComponent,
375
+ textarea : TextareaComponent,
376
+ content : InputContentComponent,
369
377
  cluster : () => null,
370
378
  custom : () => null,
371
379
  };
@@ -438,7 +446,7 @@ export function FormSupervisionComponent({
438
446
  {label && <p className="input-label">{label}</p>}
439
447
  {clusterError && <small className="input-error-message">{clusterError}</small>}
440
448
  {group.map((gIndex) => (
441
- <div key={gIndex} className={cn("relative pr-8", wrap && "p-4 rounded border", className)}>
449
+ <div key={gIndex} className={cn("relative pr-8", wrap && "form-supervision-cluster-item-wrapped", className)}>
442
450
  {label && <p className="input-label">{label} {gIndex + 1}</p>}
443
451
  {tip && <small className={cn("input-tip")}>{tip}</small>}
444
452
  {(label || tip) && <div className="mb-2"></div>}
@@ -453,7 +461,7 @@ export function FormSupervisionComponent({
453
461
  paint="danger"
454
462
  variant="outline"
455
463
  size="xs"
456
- className={cn("absolute top-10 right-2 translate-x-[50%] -translate-y-[50%]", wrap && "translate-x-0 -translate-y-0 top-1 right-1")}
464
+ className={cn("form-supervision-cluster-remove-btn", wrap && "form-supervision-cluster-remove-btn-wrapped")}
457
465
  onClick={() => removeGroup(gIndex)}
458
466
  />
459
467
  )}
@@ -463,7 +471,7 @@ export function FormSupervisionComponent({
463
471
  <div>
464
472
  <ButtonComponent
465
473
  icon={"solid/plus"}
466
- label={`${l.base.add ? l.base.add() : "Add"} ${label || mapName}`}
474
+ label={`${l.base.add ? l.base.add() : "Add"} ${label || "Lainnya"}`}
467
475
  variant="outline"
468
476
  size="sm"
469
477
  onClick={addGroup}