@sunggang/ui-lib 0.4.61 → 0.4.62

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 (6) hide show
  1. package/Form.cjs.js +80 -73
  2. package/Form.esm.js +80 -73
  3. package/index.cjs.css +9 -4
  4. package/index.esm.css +9 -4
  5. package/package.json +1 -1
  6. package/src/lib/Form/types.d.ts +1 -0
package/Form.cjs.js CHANGED
@@ -8040,11 +8040,12 @@ var FieldArray = function(param) {
8040
8040
  var config = item === null || item === void 0 ? void 0 : item.fieldArrayConfig;
8041
8041
  var fieldConfigs = (config === null || config === void 0 ? void 0 : config.fields) || [];
8042
8042
  var addButtonText = (config === null || config === void 0 ? void 0 : config.addButtonText) || "新增";
8043
- var removeButtonText = (config === null || config === void 0 ? void 0 : config.removeButtonText) || "刪除";
8043
+ (config === null || config === void 0 ? void 0 : config.removeButtonText) || "刪除";
8044
8044
  var maxItems = config === null || config === void 0 ? void 0 : config.maxItems;
8045
8045
  var minItems = (config === null || config === void 0 ? void 0 : config.minItems) || 0;
8046
8046
  var defaultItemCount = (config === null || config === void 0 ? void 0 : config.defaultItemCount) || 1;
8047
8047
  var addButtonPosition = (config === null || config === void 0 ? void 0 : config.addButtonPosition) || "bottom";
8048
+ var addButtonClassName = config === null || config === void 0 ? void 0 : config.addButtonClassName;
8048
8049
  var canAdd = !maxItems || fields.length < maxItems;
8049
8050
  var canRemove = fields.length > minItems;
8050
8051
  // 初始化：確保至少有 defaultItemCount 個項目
@@ -8112,73 +8113,99 @@ var FieldArray = function(param) {
8112
8113
  (item === null || item === void 0 ? void 0 : item.className) || "w-full"
8113
8114
  ].join(" "),
8114
8115
  children: [
8115
- /*#__PURE__*/ jsxRuntime.jsx(FieldLabel.FieldLabel, {
8116
+ (item === null || item === void 0 ? void 0 : item.label) && /*#__PURE__*/ jsxRuntime.jsx(FieldLabel.FieldLabel, {
8116
8117
  item: item
8117
8118
  }),
8118
8119
  /*#__PURE__*/ jsxRuntime.jsxs("div", {
8119
- className: "space-y-4",
8120
+ className: "space-y-2",
8120
8121
  children: [
8121
8122
  fields.map(function(field, index) {
8122
8123
  return /*#__PURE__*/ jsxRuntime.jsx("div", {
8123
- className: "border border-[#C8C8C8] rounded-xl p-4 bg-white overflow-scroll",
8124
+ className: "bg-white overflow-scroll",
8124
8125
  children: /*#__PURE__*/ jsxRuntime.jsxs("div", {
8125
- className: "flex items-start gap-2 flex-wrap lg:flex-nowrap",
8126
+ className: "flex items-start gap-2 flex-wrap lg:flex-nowrap h-[96px]",
8126
8127
  children: [
8127
8128
  fieldConfigs.map(function(fieldConfig, fieldIndex) {
8128
8129
  var _fieldConfig_validateOption;
8129
8130
  var fieldName = "".concat(item.name, ".").concat(index, ".").concat(fieldConfig.name);
8130
8131
  var fieldError = getFieldError(index, fieldConfig.name);
8132
+ var isLastField = fieldIndex === fieldConfigs.length - 1;
8131
8133
  return /*#__PURE__*/ jsxRuntime.jsxs("div", {
8132
- className: "flex-1 min-w-[200px]",
8134
+ className: [
8135
+ isLastField ? "flex items-start gap-2 flex-1" : "flex-1",
8136
+ "min-w-[200px]"
8137
+ ].join(" "),
8133
8138
  children: [
8134
8139
  /*#__PURE__*/ jsxRuntime.jsxs("div", {
8135
- className: "font-medium mb-2 text-sm",
8140
+ className: "flex-1",
8136
8141
  children: [
8137
- fieldConfig.label,
8138
- (fieldConfig === null || fieldConfig === void 0 ? void 0 : (_fieldConfig_validateOption = fieldConfig.validateOption) === null || _fieldConfig_validateOption === void 0 ? void 0 : _fieldConfig_validateOption.required) && /*#__PURE__*/ jsxRuntime.jsx("span", {
8139
- className: "pl-1 text-[#EF5533] font-bold",
8140
- children: "*"
8141
- })
8142
- ]
8143
- }),
8144
- /*#__PURE__*/ jsxRuntime.jsx(index_esm.Controller, {
8145
- name: fieldName,
8146
- control: control,
8147
- rules: fieldConfig === null || fieldConfig === void 0 ? void 0 : fieldConfig.validateOption,
8148
- render: function(param) {
8149
- var controllerField = param.field;
8150
- return /*#__PURE__*/ jsxRuntime.jsxs("div", {
8151
- className: "relative",
8142
+ /*#__PURE__*/ jsxRuntime.jsxs("div", {
8143
+ className: "font-medium mb-2 text-sm",
8152
8144
  children: [
8153
- /*#__PURE__*/ jsxRuntime.jsx("input", _object_spread_props(_object_spread({}, controllerField), {
8154
- list: "".concat(fieldName, "-datalist"),
8155
- type: "text",
8156
- className: [
8157
- (item === null || item === void 0 ? void 0 : item.disable) || (item === null || item === void 0 ? void 0 : item.disabled) ? "text-[#B0B0B0] bg-[#e5e7eb] cursor-not-allowed" : "bg-white text-[#6f6f6f]",
8158
- "w-full h-11 rounded-2xl px-4 border border-solid border-[#B4B4B4]"
8159
- ].join(" "),
8160
- placeholder: fieldConfig.placeholder || fieldConfig.label,
8161
- disabled: (item === null || item === void 0 ? void 0 : item.disable) || (item === null || item === void 0 ? void 0 : item.disabled)
8162
- })),
8163
- fieldConfig.options && fieldConfig.options.length > 0 && /*#__PURE__*/ jsxRuntime.jsx("datalist", {
8164
- id: "".concat(fieldName, "-datalist"),
8165
- children: fieldConfig.options.map(function(option, optIndex) {
8166
- return /*#__PURE__*/ jsxRuntime.jsx("option", {
8167
- value: option.value || option.name,
8168
- children: option.name
8169
- }, optIndex);
8170
- })
8145
+ fieldConfig.label,
8146
+ (fieldConfig === null || fieldConfig === void 0 ? void 0 : (_fieldConfig_validateOption = fieldConfig.validateOption) === null || _fieldConfig_validateOption === void 0 ? void 0 : _fieldConfig_validateOption.required) && /*#__PURE__*/ jsxRuntime.jsx("span", {
8147
+ className: "pl-1 text-[#EF5533] font-bold",
8148
+ children: "*"
8171
8149
  })
8172
8150
  ]
8173
- });
8174
- }
8175
- }),
8176
- (fieldError === null || fieldError === void 0 ? void 0 : fieldError.message) && /*#__PURE__*/ jsxRuntime.jsxs("div", {
8177
- className: "pt-1 text-xs text-[#EF5533]",
8178
- children: [
8179
- "*",
8180
- String(fieldError.message)
8151
+ }),
8152
+ /*#__PURE__*/ jsxRuntime.jsx(index_esm.Controller, {
8153
+ name: fieldName,
8154
+ control: control,
8155
+ rules: fieldConfig === null || fieldConfig === void 0 ? void 0 : fieldConfig.validateOption,
8156
+ render: function(param) {
8157
+ var controllerField = param.field;
8158
+ return /*#__PURE__*/ jsxRuntime.jsxs("div", {
8159
+ className: "relative",
8160
+ children: [
8161
+ /*#__PURE__*/ jsxRuntime.jsx("input", _object_spread_props(_object_spread({}, controllerField), {
8162
+ list: "".concat(fieldName, "-datalist"),
8163
+ type: "text",
8164
+ className: [
8165
+ (item === null || item === void 0 ? void 0 : item.disable) || (item === null || item === void 0 ? void 0 : item.disabled) ? "text-[#B0B0B0] bg-[#e5e7eb] cursor-not-allowed" : "bg-white text-[#6f6f6f]",
8166
+ "w-full h-11 rounded-2xl px-4 border border-solid border-[#B4B4B4]"
8167
+ ].join(" "),
8168
+ placeholder: fieldConfig.placeholder || fieldConfig.label,
8169
+ disabled: (item === null || item === void 0 ? void 0 : item.disable) || (item === null || item === void 0 ? void 0 : item.disabled)
8170
+ })),
8171
+ fieldConfig.options && fieldConfig.options.length > 0 && /*#__PURE__*/ jsxRuntime.jsx("datalist", {
8172
+ id: "".concat(fieldName, "-datalist"),
8173
+ children: fieldConfig.options.map(function(option, optIndex) {
8174
+ return /*#__PURE__*/ jsxRuntime.jsx("option", {
8175
+ value: option.value || option.name,
8176
+ children: option.name
8177
+ }, optIndex);
8178
+ })
8179
+ })
8180
+ ]
8181
+ });
8182
+ }
8183
+ }),
8184
+ (fieldError === null || fieldError === void 0 ? void 0 : fieldError.message) && /*#__PURE__*/ jsxRuntime.jsxs("div", {
8185
+ className: "pt-1 text-xs text-[#EF5533]",
8186
+ children: [
8187
+ "*",
8188
+ String(fieldError.message)
8189
+ ]
8190
+ })
8181
8191
  ]
8192
+ }),
8193
+ isLastField && canRemove && /*#__PURE__*/ jsxRuntime.jsx("button", {
8194
+ type: "button",
8195
+ onClick: function() {
8196
+ return handleRemove(index);
8197
+ },
8198
+ className: [
8199
+ "h-11 px-2 rounded-2xl",
8200
+ "text-[#EF5533] bg-white hover:bg-[#FFF5F3]",
8201
+ "transition-colors duration-200",
8202
+ "flex items-center justify-center flex-shrink-0",
8203
+ "mt-[30px]"
8204
+ ].join(" "),
8205
+ children: /*#__PURE__*/ jsxRuntime.jsx(react$1.Icon, {
8206
+ icon: "fluent-mdl2:delete",
8207
+ className: "w-6 h-6"
8208
+ })
8182
8209
  })
8183
8210
  ]
8184
8211
  }, fieldIndex);
@@ -8186,11 +8213,11 @@ var FieldArray = function(param) {
8186
8213
  addButtonPosition === "inline" && canAdd && index === fields.length - 1 && /*#__PURE__*/ jsxRuntime.jsxs("button", {
8187
8214
  type: "button",
8188
8215
  onClick: handleAdd,
8189
- className: [
8216
+ className: addButtonClassName || [
8190
8217
  "h-11 px-4 rounded-2xl border border-solid border-[#6f6f6f]",
8191
8218
  "text-[#6f6f6f] bg-white hover:bg-[#F5F5F5]",
8192
8219
  "transition-colors duration-200",
8193
- "flex items-center gap-2 whitespace-nowrap",
8220
+ "flex items-center gap-2 whitespace-nowrap flex-shrink-0",
8194
8221
  "mt-[30px]"
8195
8222
  ].join(" "),
8196
8223
  children: [
@@ -8200,26 +8227,6 @@ var FieldArray = function(param) {
8200
8227
  }),
8201
8228
  addButtonText
8202
8229
  ]
8203
- }),
8204
- canRemove && /*#__PURE__*/ jsxRuntime.jsxs("button", {
8205
- type: "button",
8206
- onClick: function() {
8207
- return handleRemove(index);
8208
- },
8209
- className: [
8210
- "h-11 px-4 rounded-2xl border border-solid border-[#EF5533]",
8211
- "text-[#EF5533] bg-white hover:bg-[#FFF5F3]",
8212
- "transition-colors duration-200",
8213
- "flex items-center gap-2 whitespace-nowrap",
8214
- "mt-[30px]"
8215
- ].join(" "),
8216
- children: [
8217
- /*#__PURE__*/ jsxRuntime.jsx(react$1.Icon, {
8218
- icon: "mdi:delete-outline",
8219
- className: "w-5 h-5"
8220
- }),
8221
- removeButtonText
8222
- ]
8223
8230
  })
8224
8231
  ]
8225
8232
  })
@@ -8228,11 +8235,11 @@ var FieldArray = function(param) {
8228
8235
  addButtonPosition === "bottom" && canAdd && /*#__PURE__*/ jsxRuntime.jsxs("button", {
8229
8236
  type: "button",
8230
8237
  onClick: handleAdd,
8231
- className: [
8232
- "h-11 px-6 rounded-2xl border border-solid border-[#6f6f6f]",
8238
+ className: addButtonClassName || [
8239
+ "h-11 px-4 rounded-2xl border border-solid border-[#6f6f6f]",
8233
8240
  "text-[#6f6f6f] bg-white hover:bg-[#F5F5F5]",
8234
8241
  "transition-colors duration-200",
8235
- "flex items-center gap-2"
8242
+ "flex items-center gap-2 whitespace-nowrap"
8236
8243
  ].join(" "),
8237
8244
  children: [
8238
8245
  /*#__PURE__*/ jsxRuntime.jsx(react$1.Icon, {
package/Form.esm.js CHANGED
@@ -8013,11 +8013,12 @@ var FieldArray = function(param) {
8013
8013
  var config = item === null || item === void 0 ? void 0 : item.fieldArrayConfig;
8014
8014
  var fieldConfigs = (config === null || config === void 0 ? void 0 : config.fields) || [];
8015
8015
  var addButtonText = (config === null || config === void 0 ? void 0 : config.addButtonText) || "新增";
8016
- var removeButtonText = (config === null || config === void 0 ? void 0 : config.removeButtonText) || "刪除";
8016
+ (config === null || config === void 0 ? void 0 : config.removeButtonText) || "刪除";
8017
8017
  var maxItems = config === null || config === void 0 ? void 0 : config.maxItems;
8018
8018
  var minItems = (config === null || config === void 0 ? void 0 : config.minItems) || 0;
8019
8019
  var defaultItemCount = (config === null || config === void 0 ? void 0 : config.defaultItemCount) || 1;
8020
8020
  var addButtonPosition = (config === null || config === void 0 ? void 0 : config.addButtonPosition) || "bottom";
8021
+ var addButtonClassName = config === null || config === void 0 ? void 0 : config.addButtonClassName;
8021
8022
  var canAdd = !maxItems || fields.length < maxItems;
8022
8023
  var canRemove = fields.length > minItems;
8023
8024
  // 初始化：確保至少有 defaultItemCount 個項目
@@ -8085,73 +8086,99 @@ var FieldArray = function(param) {
8085
8086
  (item === null || item === void 0 ? void 0 : item.className) || "w-full"
8086
8087
  ].join(" "),
8087
8088
  children: [
8088
- /*#__PURE__*/ jsx$1(FieldLabel, {
8089
+ (item === null || item === void 0 ? void 0 : item.label) && /*#__PURE__*/ jsx$1(FieldLabel, {
8089
8090
  item: item
8090
8091
  }),
8091
8092
  /*#__PURE__*/ jsxs("div", {
8092
- className: "space-y-4",
8093
+ className: "space-y-2",
8093
8094
  children: [
8094
8095
  fields.map(function(field, index) {
8095
8096
  return /*#__PURE__*/ jsx$1("div", {
8096
- className: "border border-[#C8C8C8] rounded-xl p-4 bg-white overflow-scroll",
8097
+ className: "bg-white overflow-scroll",
8097
8098
  children: /*#__PURE__*/ jsxs("div", {
8098
- className: "flex items-start gap-2 flex-wrap lg:flex-nowrap",
8099
+ className: "flex items-start gap-2 flex-wrap lg:flex-nowrap h-[96px]",
8099
8100
  children: [
8100
8101
  fieldConfigs.map(function(fieldConfig, fieldIndex) {
8101
8102
  var _fieldConfig_validateOption;
8102
8103
  var fieldName = "".concat(item.name, ".").concat(index, ".").concat(fieldConfig.name);
8103
8104
  var fieldError = getFieldError(index, fieldConfig.name);
8105
+ var isLastField = fieldIndex === fieldConfigs.length - 1;
8104
8106
  return /*#__PURE__*/ jsxs("div", {
8105
- className: "flex-1 min-w-[200px]",
8107
+ className: [
8108
+ isLastField ? "flex items-start gap-2 flex-1" : "flex-1",
8109
+ "min-w-[200px]"
8110
+ ].join(" "),
8106
8111
  children: [
8107
8112
  /*#__PURE__*/ jsxs("div", {
8108
- className: "font-medium mb-2 text-sm",
8113
+ className: "flex-1",
8109
8114
  children: [
8110
- fieldConfig.label,
8111
- (fieldConfig === null || fieldConfig === void 0 ? void 0 : (_fieldConfig_validateOption = fieldConfig.validateOption) === null || _fieldConfig_validateOption === void 0 ? void 0 : _fieldConfig_validateOption.required) && /*#__PURE__*/ jsx$1("span", {
8112
- className: "pl-1 text-[#EF5533] font-bold",
8113
- children: "*"
8114
- })
8115
- ]
8116
- }),
8117
- /*#__PURE__*/ jsx$1(Controller, {
8118
- name: fieldName,
8119
- control: control,
8120
- rules: fieldConfig === null || fieldConfig === void 0 ? void 0 : fieldConfig.validateOption,
8121
- render: function(param) {
8122
- var controllerField = param.field;
8123
- return /*#__PURE__*/ jsxs("div", {
8124
- className: "relative",
8115
+ /*#__PURE__*/ jsxs("div", {
8116
+ className: "font-medium mb-2 text-sm",
8125
8117
  children: [
8126
- /*#__PURE__*/ jsx$1("input", _object_spread_props(_object_spread({}, controllerField), {
8127
- list: "".concat(fieldName, "-datalist"),
8128
- type: "text",
8129
- className: [
8130
- (item === null || item === void 0 ? void 0 : item.disable) || (item === null || item === void 0 ? void 0 : item.disabled) ? "text-[#B0B0B0] bg-[#e5e7eb] cursor-not-allowed" : "bg-white text-[#6f6f6f]",
8131
- "w-full h-11 rounded-2xl px-4 border border-solid border-[#B4B4B4]"
8132
- ].join(" "),
8133
- placeholder: fieldConfig.placeholder || fieldConfig.label,
8134
- disabled: (item === null || item === void 0 ? void 0 : item.disable) || (item === null || item === void 0 ? void 0 : item.disabled)
8135
- })),
8136
- fieldConfig.options && fieldConfig.options.length > 0 && /*#__PURE__*/ jsx$1("datalist", {
8137
- id: "".concat(fieldName, "-datalist"),
8138
- children: fieldConfig.options.map(function(option, optIndex) {
8139
- return /*#__PURE__*/ jsx$1("option", {
8140
- value: option.value || option.name,
8141
- children: option.name
8142
- }, optIndex);
8143
- })
8118
+ fieldConfig.label,
8119
+ (fieldConfig === null || fieldConfig === void 0 ? void 0 : (_fieldConfig_validateOption = fieldConfig.validateOption) === null || _fieldConfig_validateOption === void 0 ? void 0 : _fieldConfig_validateOption.required) && /*#__PURE__*/ jsx$1("span", {
8120
+ className: "pl-1 text-[#EF5533] font-bold",
8121
+ children: "*"
8144
8122
  })
8145
8123
  ]
8146
- });
8147
- }
8148
- }),
8149
- (fieldError === null || fieldError === void 0 ? void 0 : fieldError.message) && /*#__PURE__*/ jsxs("div", {
8150
- className: "pt-1 text-xs text-[#EF5533]",
8151
- children: [
8152
- "*",
8153
- String(fieldError.message)
8124
+ }),
8125
+ /*#__PURE__*/ jsx$1(Controller, {
8126
+ name: fieldName,
8127
+ control: control,
8128
+ rules: fieldConfig === null || fieldConfig === void 0 ? void 0 : fieldConfig.validateOption,
8129
+ render: function(param) {
8130
+ var controllerField = param.field;
8131
+ return /*#__PURE__*/ jsxs("div", {
8132
+ className: "relative",
8133
+ children: [
8134
+ /*#__PURE__*/ jsx$1("input", _object_spread_props(_object_spread({}, controllerField), {
8135
+ list: "".concat(fieldName, "-datalist"),
8136
+ type: "text",
8137
+ className: [
8138
+ (item === null || item === void 0 ? void 0 : item.disable) || (item === null || item === void 0 ? void 0 : item.disabled) ? "text-[#B0B0B0] bg-[#e5e7eb] cursor-not-allowed" : "bg-white text-[#6f6f6f]",
8139
+ "w-full h-11 rounded-2xl px-4 border border-solid border-[#B4B4B4]"
8140
+ ].join(" "),
8141
+ placeholder: fieldConfig.placeholder || fieldConfig.label,
8142
+ disabled: (item === null || item === void 0 ? void 0 : item.disable) || (item === null || item === void 0 ? void 0 : item.disabled)
8143
+ })),
8144
+ fieldConfig.options && fieldConfig.options.length > 0 && /*#__PURE__*/ jsx$1("datalist", {
8145
+ id: "".concat(fieldName, "-datalist"),
8146
+ children: fieldConfig.options.map(function(option, optIndex) {
8147
+ return /*#__PURE__*/ jsx$1("option", {
8148
+ value: option.value || option.name,
8149
+ children: option.name
8150
+ }, optIndex);
8151
+ })
8152
+ })
8153
+ ]
8154
+ });
8155
+ }
8156
+ }),
8157
+ (fieldError === null || fieldError === void 0 ? void 0 : fieldError.message) && /*#__PURE__*/ jsxs("div", {
8158
+ className: "pt-1 text-xs text-[#EF5533]",
8159
+ children: [
8160
+ "*",
8161
+ String(fieldError.message)
8162
+ ]
8163
+ })
8154
8164
  ]
8165
+ }),
8166
+ isLastField && canRemove && /*#__PURE__*/ jsx$1("button", {
8167
+ type: "button",
8168
+ onClick: function() {
8169
+ return handleRemove(index);
8170
+ },
8171
+ className: [
8172
+ "h-11 px-2 rounded-2xl",
8173
+ "text-[#EF5533] bg-white hover:bg-[#FFF5F3]",
8174
+ "transition-colors duration-200",
8175
+ "flex items-center justify-center flex-shrink-0",
8176
+ "mt-[30px]"
8177
+ ].join(" "),
8178
+ children: /*#__PURE__*/ jsx$1(Icon, {
8179
+ icon: "fluent-mdl2:delete",
8180
+ className: "w-6 h-6"
8181
+ })
8155
8182
  })
8156
8183
  ]
8157
8184
  }, fieldIndex);
@@ -8159,11 +8186,11 @@ var FieldArray = function(param) {
8159
8186
  addButtonPosition === "inline" && canAdd && index === fields.length - 1 && /*#__PURE__*/ jsxs("button", {
8160
8187
  type: "button",
8161
8188
  onClick: handleAdd,
8162
- className: [
8189
+ className: addButtonClassName || [
8163
8190
  "h-11 px-4 rounded-2xl border border-solid border-[#6f6f6f]",
8164
8191
  "text-[#6f6f6f] bg-white hover:bg-[#F5F5F5]",
8165
8192
  "transition-colors duration-200",
8166
- "flex items-center gap-2 whitespace-nowrap",
8193
+ "flex items-center gap-2 whitespace-nowrap flex-shrink-0",
8167
8194
  "mt-[30px]"
8168
8195
  ].join(" "),
8169
8196
  children: [
@@ -8173,26 +8200,6 @@ var FieldArray = function(param) {
8173
8200
  }),
8174
8201
  addButtonText
8175
8202
  ]
8176
- }),
8177
- canRemove && /*#__PURE__*/ jsxs("button", {
8178
- type: "button",
8179
- onClick: function() {
8180
- return handleRemove(index);
8181
- },
8182
- className: [
8183
- "h-11 px-4 rounded-2xl border border-solid border-[#EF5533]",
8184
- "text-[#EF5533] bg-white hover:bg-[#FFF5F3]",
8185
- "transition-colors duration-200",
8186
- "flex items-center gap-2 whitespace-nowrap",
8187
- "mt-[30px]"
8188
- ].join(" "),
8189
- children: [
8190
- /*#__PURE__*/ jsx$1(Icon, {
8191
- icon: "mdi:delete-outline",
8192
- className: "w-5 h-5"
8193
- }),
8194
- removeButtonText
8195
- ]
8196
8203
  })
8197
8204
  ]
8198
8205
  })
@@ -8201,11 +8208,11 @@ var FieldArray = function(param) {
8201
8208
  addButtonPosition === "bottom" && canAdd && /*#__PURE__*/ jsxs("button", {
8202
8209
  type: "button",
8203
8210
  onClick: handleAdd,
8204
- className: [
8205
- "h-11 px-6 rounded-2xl border border-solid border-[#6f6f6f]",
8211
+ className: addButtonClassName || [
8212
+ "h-11 px-4 rounded-2xl border border-solid border-[#6f6f6f]",
8206
8213
  "text-[#6f6f6f] bg-white hover:bg-[#F5F5F5]",
8207
8214
  "transition-colors duration-200",
8208
- "flex items-center gap-2"
8215
+ "flex items-center gap-2 whitespace-nowrap"
8209
8216
  ].join(" "),
8210
8217
  children: [
8211
8218
  /*#__PURE__*/ jsx$1(Icon, {
package/index.cjs.css CHANGED
@@ -1584,6 +1584,9 @@ video {
1584
1584
  .mb-4 {
1585
1585
  margin-bottom: 1rem;
1586
1586
  }
1587
+ .mb-5 {
1588
+ margin-bottom: 1.25rem;
1589
+ }
1587
1590
  .mb-6 {
1588
1591
  margin-bottom: 1.5rem;
1589
1592
  }
@@ -1768,6 +1771,9 @@ video {
1768
1771
  .h-\[44px\] {
1769
1772
  height: 44px;
1770
1773
  }
1774
+ .h-\[96px\] {
1775
+ height: 96px;
1776
+ }
1771
1777
  .h-\[var\(--radix-select-trigger-height\)\] {
1772
1778
  height: var(--radix-select-trigger-height);
1773
1779
  }
@@ -1956,6 +1962,9 @@ video {
1956
1962
  .flex-shrink {
1957
1963
  flex-shrink: 1;
1958
1964
  }
1965
+ .flex-shrink-0 {
1966
+ flex-shrink: 0;
1967
+ }
1959
1968
  .shrink {
1960
1969
  flex-shrink: 1;
1961
1970
  }
@@ -2355,10 +2364,6 @@ video {
2355
2364
  --tw-border-opacity: 1;
2356
2365
  border-color: rgb(217 217 217 / var(--tw-border-opacity, 1));
2357
2366
  }
2358
- .border-\[\#EF5533\] {
2359
- --tw-border-opacity: 1;
2360
- border-color: rgb(239 85 51 / var(--tw-border-opacity, 1));
2361
- }
2362
2367
  .border-\[\#ccc\] {
2363
2368
  --tw-border-opacity: 1;
2364
2369
  border-color: rgb(204 204 204 / var(--tw-border-opacity, 1));
package/index.esm.css CHANGED
@@ -1584,6 +1584,9 @@ video {
1584
1584
  .mb-4 {
1585
1585
  margin-bottom: 1rem;
1586
1586
  }
1587
+ .mb-5 {
1588
+ margin-bottom: 1.25rem;
1589
+ }
1587
1590
  .mb-6 {
1588
1591
  margin-bottom: 1.5rem;
1589
1592
  }
@@ -1768,6 +1771,9 @@ video {
1768
1771
  .h-\[44px\] {
1769
1772
  height: 44px;
1770
1773
  }
1774
+ .h-\[96px\] {
1775
+ height: 96px;
1776
+ }
1771
1777
  .h-\[var\(--radix-select-trigger-height\)\] {
1772
1778
  height: var(--radix-select-trigger-height);
1773
1779
  }
@@ -1956,6 +1962,9 @@ video {
1956
1962
  .flex-shrink {
1957
1963
  flex-shrink: 1;
1958
1964
  }
1965
+ .flex-shrink-0 {
1966
+ flex-shrink: 0;
1967
+ }
1959
1968
  .shrink {
1960
1969
  flex-shrink: 1;
1961
1970
  }
@@ -2355,10 +2364,6 @@ video {
2355
2364
  --tw-border-opacity: 1;
2356
2365
  border-color: rgb(217 217 217 / var(--tw-border-opacity, 1));
2357
2366
  }
2358
- .border-\[\#EF5533\] {
2359
- --tw-border-opacity: 1;
2360
- border-color: rgb(239 85 51 / var(--tw-border-opacity, 1));
2361
- }
2362
2367
  .border-\[\#ccc\] {
2363
2368
  --tw-border-opacity: 1;
2364
2369
  border-color: rgb(204 204 204 / var(--tw-border-opacity, 1));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sunggang/ui-lib",
3
- "version": "0.4.61",
3
+ "version": "0.4.62",
4
4
  "sideEffects": [
5
5
  "*.css",
6
6
  "./src/style.css",
package/src/lib/Form/types.d.ts CHANGED
@@ -176,6 +176,7 @@ export interface FormItem {
176
176
  minItems?: number;
177
177
  defaultItemCount?: number;
178
178
  addButtonPosition?: 'inline' | 'bottom';
179
+ addButtonClassName?: string;
179
180
  };
180
181
  }
181
182
  export interface FormType {