@sunggang/ui-lib 0.3.5 → 0.3.6

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/BaseCkeditor.esm.js +5 -0
  2. package/index.esm.css +7 -9
  3. package/index.esm2.js +52 -31
  4. package/package.json +1 -1
  5. package/src/lib/Form/demo.d.ts +0 -40
  6. package/src/lib/Form/types.d.ts +3 -0
package/BaseCkeditor.esm.js CHANGED
@@ -66819,6 +66819,11 @@ var BaseCkeditor = function(param) {
66819
66819
  onChange: function(_, editor) {
66820
66820
  var data = editor.getData();
66821
66821
  onChange(data);
66822
+ },
66823
+ onReady: function(editor) {
66824
+ if (item === null || item === void 0 ? void 0 : item.disabled) {
66825
+ editor.enableReadOnlyMode(item.name);
66826
+ }
66822
66827
  }
66823
66828
  }),
66824
66829
  validateMsg(errors, item) && /*#__PURE__*/ jsxs("div", {
package/index.esm.css CHANGED
@@ -1406,14 +1406,14 @@ video {
1406
1406
  --tw-bg-opacity: 1;
1407
1407
  background-color: rgb(86 207 207 / var(--tw-bg-opacity, 1));
1408
1408
  }
1409
- .bg-\[\#E6E6E6\] {
1410
- --tw-bg-opacity: 1;
1411
- background-color: rgb(230 230 230 / var(--tw-bg-opacity, 1));
1412
- }
1413
1409
  .bg-\[\#F5F5F5\] {
1414
1410
  --tw-bg-opacity: 1;
1415
1411
  background-color: rgb(245 245 245 / var(--tw-bg-opacity, 1));
1416
1412
  }
1413
+ .bg-\[\#e5e7eb\] {
1414
+ --tw-bg-opacity: 1;
1415
+ background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1));
1416
+ }
1417
1417
  .bg-\[\#f5f5f5\] {
1418
1418
  --tw-bg-opacity: 1;
1419
1419
  background-color: rgb(245 245 245 / var(--tw-bg-opacity, 1));
@@ -1821,10 +1821,6 @@ video {
1821
1821
  --tw-text-opacity: 1;
1822
1822
  color: rgb(23 26 31 / var(--tw-text-opacity, 1));
1823
1823
  }
1824
- .text-\[\#181818\] {
1825
- --tw-text-opacity: 1;
1826
- color: rgb(24 24 24 / var(--tw-text-opacity, 1));
1827
- }
1828
1824
  .text-\[\#2052ce\] {
1829
1825
  --tw-text-opacity: 1;
1830
1826
  color: rgb(32 82 206 / var(--tw-text-opacity, 1));
@@ -2271,7 +2267,9 @@ video {
2271
2267
  .customInput::-webkit-input-placeholder,
2272
2268
  .customInput::placeholder,
2273
2269
  .customSelect::-webkit-input-placeholder,
2274
- .customSelect::placeholder {
2270
+ .customSelect::placeholder,
2271
+ .customTextarea::-webkit-input-placeholder,
2272
+ .customTextarea::placeholder {
2275
2273
  color: #6f6f6f;
2276
2274
  font-size: 14px;
2277
2275
  text-align: left;
package/index.esm2.js CHANGED
@@ -31441,7 +31441,7 @@ function _templateObject$1() {
31441
31441
  }
31442
31442
  function _templateObject1() {
31443
31443
  var data = _tagged_template_literal$1([
31444
- "\n .MuiOutlinedInput-input {\n padding: 0 1rem;\n height: 40px;\n }\n .customerTimePicker::-webkit-input-placeholder,\n .customerTimePicker::placeholder,\n .customInput::-webkit-input-placeholder,\n .customInput::placeholder {\n color: #6f6f6f;\n font-size: 15px;\n text-align: left;\n padding: 0 2px;\n }\n\n .customSelect,\n .customInput {\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .baseForm.textInput::-webkit-input-placeholder,\n .baseForm.textInput::placeholder {\n color: #6f6f6f;\n }\n"
31444
+ "\n .MuiOutlinedInput-input {\n padding: 0 1rem;\n height: 40px;\n }\n .customerTimePicker::-webkit-input-placeholder,\n .customerTimePicker::placeholder,\n .customInput::-webkit-input-placeholder,\n .customInput::placeholder {\n color: #6f6f6f;\n font-size: 15px;\n text-align: left;\n padding: 0 2px;\n }\n\n .customSelect,\n .customInput {\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n"
31445
31445
  ]);
31446
31446
  _templateObject1 = function _templateObject() {
31447
31447
  return data;
@@ -31450,7 +31450,7 @@ function _templateObject1() {
31450
31450
  }
31451
31451
  function _templateObject2() {
31452
31452
  var data = _tagged_template_literal$1([
31453
- "\n .customerTimePicker::-webkit-input-placeholder,\n .customerTimePicker::placeholder,\n .customInput::-webkit-input-placeholder,\n .customInput::placeholder {\n color: #6f6f6f;\n font-size: 15px;\n text-align: left;\n padding: 0 2px;\n }\n\n .customSelect,\n .customInput {\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n .baseForm.textInput::-webkit-input-placeholder,\n .baseForm.textInput::placeholder {\n color: #6f6f6f;\n }\n"
31453
+ "\n .customerTimePicker::-webkit-input-placeholder,\n .customerTimePicker::placeholder,\n .customInput::-webkit-input-placeholder,\n .customInput::placeholder {\n color: #6f6f6f;\n font-size: 15px;\n text-align: left;\n padding: 0 2px;\n }\n\n .customSelect,\n .customInput {\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n }\n"
31454
31454
  ]);
31455
31455
  _templateObject2 = function _templateObject() {
31456
31456
  return data;
@@ -46845,7 +46845,7 @@ var CityDistrict = function(param) {
46845
46845
  children: [
46846
46846
  /*#__PURE__*/ jsx("div", {
46847
46847
  className: "absolute w-12 h-11 top-0 right-0 z-5 flex items-center justify-center rounded-r-lg pointer-events-none",
46848
- children: /*#__PURE__*/ jsx(Icon, {
46848
+ children: !(item === null || item === void 0 ? void 0 : item.hiddenArrow) && /*#__PURE__*/ jsx(Icon, {
46849
46849
  className: "h-6 w-6",
46850
46850
  icon: "ri:arrow-down-s-line",
46851
46851
  color: "6f6f6f"
@@ -46853,8 +46853,8 @@ var CityDistrict = function(param) {
46853
46853
  }),
46854
46854
  /*#__PURE__*/ jsxs("select", _object_spread_props$9(_object_spread$c({
46855
46855
  className: [
46856
- (item === null || item === void 0 ? void 0 : item.disable) ? "text-[#B0B0B0] bg-[#E6E6E6] pointer-events-none" : "bg-white pointer-events-auto",
46857
- "customSelect w-full h-11 text-[15px] py-2 pr-4 rounded-lg text-[#6f6f6f] border border-solid border-gray-300",
46856
+ (item === null || item === void 0 ? void 0 : item.disable) || (item === null || item === void 0 ? void 0 : item.disabled) ? "text-[#B0B0B0] bg-[#e5e7eb] pointer-events-none" : "bg-white pointer-events-auto text-[#6f6f6f]",
46857
+ "customSelect w-full h-11 text-[15px] py-2 pr-4 rounded-lg border border-solid border-gray-300",
46858
46858
  (item === null || item === void 0 ? void 0 : item.icon) ? "pl-14" : "pl-4"
46859
46859
  ].join(" "),
46860
46860
  style: item === null || item === void 0 ? void 0 : item.style
@@ -46862,6 +46862,7 @@ var CityDistrict = function(param) {
46862
46862
  onChange: function(e) {
46863
46863
  return handleCity(e, (item === null || item === void 0 ? void 0 : item.cityName) || "");
46864
46864
  },
46865
+ disabled: (item === null || item === void 0 ? void 0 : item.disable) || (item === null || item === void 0 ? void 0 : item.disabled),
46865
46866
  children: [
46866
46867
  /*#__PURE__*/ jsx("option", {
46867
46868
  value: "",
@@ -46882,7 +46883,7 @@ var CityDistrict = function(param) {
46882
46883
  children: [
46883
46884
  /*#__PURE__*/ jsx("div", {
46884
46885
  className: "absolute w-12 h-11 top-0 right-0 z-5 flex items-center justify-center rounded-r-lg pointer-events-none",
46885
- children: /*#__PURE__*/ jsx(Icon, {
46886
+ children: !(item === null || item === void 0 ? void 0 : item.hiddenArrow) && /*#__PURE__*/ jsx(Icon, {
46886
46887
  className: "h-6 w-6",
46887
46888
  icon: "ri:arrow-down-s-line",
46888
46889
  color: "6f6f6f"
@@ -46890,8 +46891,8 @@ var CityDistrict = function(param) {
46890
46891
  }),
46891
46892
  /*#__PURE__*/ jsxs("select", _object_spread_props$9(_object_spread$c({
46892
46893
  className: [
46893
- (item === null || item === void 0 ? void 0 : item.disable) ? "text-[#B0B0B0] bg-[#E6E6E6] pointer-events-none" : "bg-white pointer-events-auto",
46894
- "customSelect w-full h-11 text-[15px] py-2 pr-4 rounded-lg text-[#6f6f6f] border border-solid border-gray-300",
46894
+ (item === null || item === void 0 ? void 0 : item.disable) || (item === null || item === void 0 ? void 0 : item.disabled) ? "text-[#B0B0B0] bg-[#e5e7eb] pointer-events-none" : "bg-white pointer-events-auto text-[#6f6f6f]",
46895
+ "customSelect w-full h-11 text-[15px] py-2 pr-4 rounded-lg border border-solid border-gray-300",
46895
46896
  (item === null || item === void 0 ? void 0 : item.subIcon) ? "pl-14" : "pl-4"
46896
46897
  ].join(" "),
46897
46898
  style: item === null || item === void 0 ? void 0 : item.style
@@ -46899,6 +46900,7 @@ var CityDistrict = function(param) {
46899
46900
  onChange: function(e) {
46900
46901
  return handleCity(e, (item === null || item === void 0 ? void 0 : item.districtName) || "");
46901
46902
  },
46903
+ disabled: (item === null || item === void 0 ? void 0 : item.disable) || (item === null || item === void 0 ? void 0 : item.disabled),
46902
46904
  children: [
46903
46905
  !currentCity && /*#__PURE__*/ jsx("option", {
46904
46906
  value: "",
@@ -47066,14 +47068,14 @@ var TextField = function(param) {
47066
47068
  children: /*#__PURE__*/ jsx("input", _object_spread_props$8(_object_spread$b({
47067
47069
  type: item === null || item === void 0 ? void 0 : item.type,
47068
47070
  className: [
47069
- (item === null || item === void 0 ? void 0 : item.disable) ? "bg-[#E6E6E6] text-[#B0B0B0] pointer-events-none" : "bg-white pointer-events-auto",
47070
- "w-full h-11 rounded-lg baseForm textInput text-[#6f6f6f] customInput pr-4 border border-solid border-gray-300",
47071
+ (item === null || item === void 0 ? void 0 : item.disable) || (item === null || item === void 0 ? void 0 : item.disabled) ? "text-[#B0B0B0] bg-[#e5e7eb] pointer-events-none" : "bg-white text-[#6f6f6f]",
47072
+ "w-full h-11 rounded-lg customInput pr-4 border border-solid border-gray-300",
47071
47073
  (item === null || item === void 0 ? void 0 : item.icon) ? "pl-14" : "pl-4"
47072
47074
  ].join(" "),
47073
47075
  placeholder: item === null || item === void 0 ? void 0 : item.placeholder
47074
47076
  }, register(item === null || item === void 0 ? void 0 : item.name, _object_spread$b({}, item === null || item === void 0 ? void 0 : item.validateOption))), {
47075
47077
  style: item === null || item === void 0 ? void 0 : item.style,
47076
- disabled: item === null || item === void 0 ? void 0 : item.disable
47078
+ disabled: (item === null || item === void 0 ? void 0 : item.disable) || (item === null || item === void 0 ? void 0 : item.disabled)
47077
47079
  }))
47078
47080
  }),
47079
47081
  validateMsg(errors, item) && /*#__PURE__*/ jsxs("div", {
@@ -47095,14 +47097,14 @@ var TextField = function(param) {
47095
47097
  type: item === null || item === void 0 ? void 0 : item.type,
47096
47098
  inputMode: "numeric",
47097
47099
  className: [
47098
- (item === null || item === void 0 ? void 0 : item.disable) ? "bg-[#E6E6E6] text-[#B0B0B0] pointer-events-none" : "bg-white pointer-events-auto",
47099
- "w-full h-11 rounded-lg baseForm textInput text-[#6f6f6f] customInput px-4 border border-solid border-gray-300 appearance-none"
47100
+ (item === null || item === void 0 ? void 0 : item.disable) || (item === null || item === void 0 ? void 0 : item.disabled) ? "text-[#B0B0B0] bg-[#e5e7eb] pointer-events-none" : "bg-white text-[#6f6f6f]",
47101
+ "w-full h-11 rounded-lg customInput px-4 border border-solid border-gray-300 appearance-none"
47100
47102
  ].join(" "),
47101
47103
  placeholder: item === null || item === void 0 ? void 0 : item.placeholder
47102
47104
  }, register(item === null || item === void 0 ? void 0 : item.name, _object_spread$b({}, item === null || item === void 0 ? void 0 : item.validateOption))), {
47103
47105
  style: item === null || item === void 0 ? void 0 : item.style,
47104
47106
  onChange: handleReplace,
47105
- disabled: item === null || item === void 0 ? void 0 : item.disable
47107
+ disabled: (item === null || item === void 0 ? void 0 : item.disable) || (item === null || item === void 0 ? void 0 : item.disabled)
47106
47108
  }))
47107
47109
  }),
47108
47110
  validateMsg(errors, item) && /*#__PURE__*/ jsxs("div", {
@@ -47139,7 +47141,7 @@ var SingleSelect = function(param) {
47139
47141
  children: [
47140
47142
  /*#__PURE__*/ jsx("div", {
47141
47143
  className: "absolute w-12 h-11 top-0 right-0 z-5 flex items-center justify-center rounded-r-lg pointer-events-none",
47142
- children: /*#__PURE__*/ jsx(Icon, {
47144
+ children: !(item === null || item === void 0 ? void 0 : item.hiddenArrow) && /*#__PURE__*/ jsx(Icon, {
47143
47145
  className: "h-6 w-6",
47144
47146
  icon: "ri:arrow-down-s-line",
47145
47147
  color: "6f6f6f"
@@ -47147,14 +47149,14 @@ var SingleSelect = function(param) {
47147
47149
  }),
47148
47150
  /*#__PURE__*/ jsx("select", _object_spread_props$8(_object_spread$b({
47149
47151
  className: [
47150
- (item === null || item === void 0 ? void 0 : item.disable) ? "text-[#B0B0B0] bg-[#E6E6E6] pointer-events-none" : "bg-white text-[#6f6f6f] pointer-events-auto",
47152
+ (item === null || item === void 0 ? void 0 : item.disable) || (item === null || item === void 0 ? void 0 : item.disabled) ? "text-[#B0B0B0] bg-[#e5e7eb] pointer-events-none" : "bg-white text-[#6f6f6f]",
47151
47153
  "customSelect w-full h-11 py-2 pr-4 rounded-lg border border-solid border-gray-300 pl-4"
47152
47154
  ].join(" "),
47153
47155
  style: item.style
47154
47156
  }, register(item.name, _object_spread$b({}, item === null || item === void 0 ? void 0 : item.validateOption))), {
47155
47157
  defaultValue: getValues(item.name),
47156
- disabled: item === null || item === void 0 ? void 0 : item.disable,
47157
47158
  id: item === null || item === void 0 ? void 0 : item.id,
47159
+ disabled: (item === null || item === void 0 ? void 0 : item.disable) || (item === null || item === void 0 ? void 0 : item.disabled),
47158
47160
  children: item === null || item === void 0 ? void 0 : (_item_option = item.option) === null || _item_option === void 0 ? void 0 : _item_option.map(function(group) {
47159
47161
  return "label" in group ? /*#__PURE__*/ jsx("optgroup", {
47160
47162
  label: group.label,
@@ -47192,12 +47194,24 @@ var MultipleSelect = function(param) {
47192
47194
  label: v.name
47193
47195
  });
47194
47196
  });
47197
+ var isDisabled = (item === null || item === void 0 ? void 0 : item.disable) || (item === null || item === void 0 ? void 0 : item.disabled);
47195
47198
  var customStyles = {
47196
- indicatorsContainer: function(provided) {
47199
+ control: function(provided) {
47197
47200
  return _object_spread_props$8(_object_spread$b({}, provided), {
47198
- minHeight: "42px"
47201
+ minHeight: "42px",
47202
+ backgroundColor: isDisabled ? "#e5e7eb" : "white",
47203
+ pointerEvents: isDisabled ? "none" : "auto"
47199
47204
  });
47200
47205
  },
47206
+ singleValue: function(provided) {
47207
+ return _object_spread$b({}, provided);
47208
+ },
47209
+ multiValueLabel: function(provided) {
47210
+ return _object_spread$b({}, provided);
47211
+ },
47212
+ indicatorsContainer: function(provided) {
47213
+ return _object_spread$b({}, provided);
47214
+ },
47201
47215
  menuPortal: function(base) {
47202
47216
  return _object_spread_props$8(_object_spread$b({}, base), {
47203
47217
  zIndex: 9999
@@ -47230,7 +47244,8 @@ var MultipleSelect = function(param) {
47230
47244
  closeMenuOnSelect: false,
47231
47245
  noOptionsMessage: function() {
47232
47246
  return "沒有可選項目";
47233
- }
47247
+ },
47248
+ isDisabled: isDisabled
47234
47249
  }));
47235
47250
  }
47236
47251
  }),
@@ -47275,14 +47290,14 @@ var Time = function(param) {
47275
47290
  children: [
47276
47291
  /*#__PURE__*/ jsx("input", _object_spread$b(_object_spread_props$8(_object_spread$b({
47277
47292
  className: [
47278
- (item === null || item === void 0 ? void 0 : item.disable) ? "text-[#B0B0B0] bg-[#E6E6E6] pointer-events-none" : "bg-white text-[#0f172a] pointer-events-auto",
47293
+ (item === null || item === void 0 ? void 0 : item.disable) || (item === null || item === void 0 ? void 0 : item.disabled) ? "text-[#B0B0B0] bg-[#e5e7eb] pointer-events-none" : "bg-white text-[#0f172a]",
47279
47294
  "customTime border border-solid border-gray-300 px-3 py-2 rounded-lg w-full text-[16px]"
47280
47295
  ].join(" "),
47281
47296
  type: (item === null || item === void 0 ? void 0 : item.type) || "time",
47282
47297
  placeholder: "ex: 16:00"
47283
47298
  }, register(item === null || item === void 0 ? void 0 : item.name, _object_spread$b({}, item === null || item === void 0 ? void 0 : item.validateOption))), {
47284
47299
  style: item === null || item === void 0 ? void 0 : item.style,
47285
- disabled: item === null || item === void 0 ? void 0 : item.disable,
47300
+ disabled: item === null || item === void 0 ? void 0 : item.disabled,
47286
47301
  id: item === null || item === void 0 ? void 0 : item.id,
47287
47302
  max: "2037-12-31T23:59"
47288
47303
  }), step, onInput)),
@@ -47330,7 +47345,7 @@ var City = function(param) {
47330
47345
  }),
47331
47346
  /*#__PURE__*/ jsx("div", {
47332
47347
  className: "absolute w-12 h-11 top-0 right-0 z-5 flex items-center justify-center rounded-r-lg pointer-events-none",
47333
- children: /*#__PURE__*/ jsx(Icon, {
47348
+ children: !(item === null || item === void 0 ? void 0 : item.hiddenArrow) && /*#__PURE__*/ jsx(Icon, {
47334
47349
  className: "h-6 w-6",
47335
47350
  icon: "ri:arrow-down-s-line",
47336
47351
  color: "6f6f6f"
@@ -47338,11 +47353,12 @@ var City = function(param) {
47338
47353
  }),
47339
47354
  /*#__PURE__*/ jsx("select", _object_spread_props$8(_object_spread$b({
47340
47355
  className: [
47341
- (item === null || item === void 0 ? void 0 : item.disable) ? "text-[#B0B0B0] bg-[#E6E6E6] pointer-events-none" : "bg-white text-[#6f6f6f] pointer-events-auto",
47356
+ (item === null || item === void 0 ? void 0 : item.disable) ? "text-[#B0B0B0] bg-[#e5e7eb] pointer-events-none" : "bg-white text-[#6f6f6f]",
47342
47357
  "customSelect w-full h-11 py-2 pr-4 rounded-lg border border-solid border-gray-300 pl-4 mr-6"
47343
47358
  ].join(" "),
47344
47359
  style: item === null || item === void 0 ? void 0 : item.style
47345
47360
  }, register(item.name, _object_spread$b({}, item === null || item === void 0 ? void 0 : item.validateOption))), {
47361
+ disabled: item === null || item === void 0 ? void 0 : item.disable,
47346
47362
  children: (CityDataMap === null || CityDataMap === void 0 ? void 0 : CityDataMap.length) && CityDataMap.map(function(v) {
47347
47363
  return /*#__PURE__*/ jsx("option", {
47348
47364
  value: v.value,
@@ -47383,7 +47399,9 @@ var CheckboxField = function(param) {
47383
47399
  children: item === null || item === void 0 ? void 0 : (_item_checkboxes1 = item.checkboxes) === null || _item_checkboxes1 === void 0 ? void 0 : _item_checkboxes1.map(function(checkbox, index) {
47384
47400
  var _checkbox_validateOption;
47385
47401
  return /*#__PURE__*/ jsxs("div", {
47386
- className: "flex items-center gap-1 my-2",
47402
+ className: [
47403
+ "flex items-center gap-1 my-2"
47404
+ ].join(" "),
47387
47405
  children: [
47388
47406
  /*#__PURE__*/ jsx(Controller$2, {
47389
47407
  name: checkbox === null || checkbox === void 0 ? void 0 : checkbox.name,
@@ -47391,6 +47409,7 @@ var CheckboxField = function(param) {
47391
47409
  rules: (checkbox === null || checkbox === void 0 ? void 0 : (_checkbox_validateOption = checkbox.validateOption) === null || _checkbox_validateOption === void 0 ? void 0 : _checkbox_validateOption.required) ? {
47392
47410
  required: checkbox === null || checkbox === void 0 ? void 0 : checkbox.errorText
47393
47411
  } : undefined,
47412
+ disabled: checkbox.disabled,
47394
47413
  render: function(param) {
47395
47414
  var field = param.field;
47396
47415
  return /*#__PURE__*/ jsx(Checkbox, _object_spread_props$8(_object_spread$b({}, field, checkbox === null || checkbox === void 0 ? void 0 : checkbox.muiProps), {
@@ -47402,7 +47421,7 @@ var CheckboxField = function(param) {
47402
47421
  }
47403
47422
  }),
47404
47423
  /*#__PURE__*/ jsx("div", {
47405
- className: checkbox === null || checkbox === void 0 ? void 0 : checkbox.checkboxLabelClass,
47424
+ className: (checkbox === null || checkbox === void 0 ? void 0 : checkbox.disabled) ? "text-[#B0B0B0]" : checkbox === null || checkbox === void 0 ? void 0 : checkbox.checkboxLabelClass,
47406
47425
  children: checkbox === null || checkbox === void 0 ? void 0 : checkbox.checkboxLabel
47407
47426
  }),
47408
47427
  validateMsg(errors, checkbox) && /*#__PURE__*/ jsxs("div", {
@@ -47424,6 +47443,7 @@ var CheckboxField = function(param) {
47424
47443
  rules: (item === null || item === void 0 ? void 0 : (_item_validateOption = item.validateOption) === null || _item_validateOption === void 0 ? void 0 : _item_validateOption.required) ? {
47425
47444
  required: item === null || item === void 0 ? void 0 : item.errorText
47426
47445
  } : undefined,
47446
+ disabled: item.disable || (item === null || item === void 0 ? void 0 : item.disabled),
47427
47447
  render: function(param) {
47428
47448
  var field = param.field;
47429
47449
  return /*#__PURE__*/ jsx(Checkbox, _object_spread_props$8(_object_spread$b({}, field, item === null || item === void 0 ? void 0 : item.muiProps), {
@@ -47435,7 +47455,7 @@ var CheckboxField = function(param) {
47435
47455
  }
47436
47456
  }),
47437
47457
  /*#__PURE__*/ jsx("div", {
47438
- className: item === null || item === void 0 ? void 0 : item.checkboxLabelClass,
47458
+ className: item.disable || (item === null || item === void 0 ? void 0 : item.disabled) ? "text-[#B0B0B0]" : item === null || item === void 0 ? void 0 : item.checkboxLabelClass,
47439
47459
  children: item === null || item === void 0 ? void 0 : item.checkboxLabel
47440
47460
  }),
47441
47461
  validateMsg(errors, item) && /*#__PURE__*/ jsxs("div", {
@@ -47481,7 +47501,7 @@ var RadioField = function(param) {
47481
47501
  value: option === null || option === void 0 ? void 0 : option.value,
47482
47502
  control: /*#__PURE__*/ jsx(Radio, _object_spread$b({}, item === null || item === void 0 ? void 0 : item.muiProps)),
47483
47503
  label: option === null || option === void 0 ? void 0 : option.label,
47484
- disabled: (option === null || option === void 0 ? void 0 : option.disabled) || false
47504
+ disabled: (option === null || option === void 0 ? void 0 : option.disable) || (option === null || option === void 0 ? void 0 : option.disabled) || false
47485
47505
  }, index);
47486
47506
  })
47487
47507
  }));
@@ -47512,12 +47532,13 @@ var Textarea = function(param) {
47512
47532
  }),
47513
47533
  /*#__PURE__*/ jsx("textarea", _object_spread_props$8(_object_spread$b({
47514
47534
  className: [
47515
- (item === null || item === void 0 ? void 0 : item.disable) ? "text-[#B0B0B0] bg-[#E6E6E6] pointer-events-none" : "bg-white text-[#0f172a] pointer-events-auto",
47516
- "bookingTextarea border border-solid border-[#C8C8C8] rounded-xl w-full p-4 text-[#6f6f6f] min-h-[6rem]"
47535
+ (item === null || item === void 0 ? void 0 : item.disable) || (item === null || item === void 0 ? void 0 : item.disabled) ? "text-[#B0B0B0] bg-[#e5e7eb] pointer-events-none" : "bg-white text-[#6f6f6f]",
47536
+ "customTextarea border border-solid border-[#C8C8C8] rounded-xl w-full p-4 min-h-[6rem]"
47517
47537
  ].join(" "),
47518
47538
  style: item === null || item === void 0 ? void 0 : item.style
47519
47539
  }, register(item.name, _object_spread$b({}, item === null || item === void 0 ? void 0 : item.validateOption))), {
47520
- placeholder: item.placeholder
47540
+ placeholder: item.placeholder,
47541
+ disabled: (item === null || item === void 0 ? void 0 : item.disable) || (item === null || item === void 0 ? void 0 : item.disabled)
47521
47542
  })),
47522
47543
  validateMsg(errors, item) && /*#__PURE__*/ jsxs("div", {
47523
47544
  className: "pt-1 text-xs text-[#EF5533]",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sunggang/ui-lib",
3
- "version": "0.3.5",
3
+ "version": "0.3.6",
4
4
  "dependencies": {
5
5
  "@emotion/react": "^11.14.0",
6
6
  "@emotion/styled": "^11.14.0",
package/src/lib/Form/demo.d.ts CHANGED
@@ -10,46 +10,6 @@ export declare const ticketBundleOptions: {
10
10
  value: number;
11
11
  }[];
12
12
  export declare const config: (getValues: any) => (FormItem[] | ({
13
- type: string;
14
- name: string;
15
- label: string;
16
- id: string;
17
- placeholder: string;
18
- validateOption?: undefined;
19
- text_size?: undefined;
20
- textColor?: undefined;
21
- errorText?: undefined;
22
- } | {
23
- type: string;
24
- name: string;
25
- label: string;
26
- id: string;
27
- placeholder: string;
28
- validateOption: {
29
- pattern: RegExp;
30
- validateMsg: string;
31
- required?: undefined;
32
- validate?: undefined;
33
- };
34
- text_size?: undefined;
35
- textColor?: undefined;
36
- errorText?: undefined;
37
- } | {
38
- type: string;
39
- name: string;
40
- label: string;
41
- id: string;
42
- placeholder: string;
43
- text_size: string;
44
- textColor: string;
45
- errorText: string;
46
- validateOption: {
47
- required: boolean;
48
- validate: (value: string) => true | "身分證格式錯誤";
49
- pattern?: undefined;
50
- validateMsg?: undefined;
51
- };
52
- })[] | ({
53
13
  type: string;
54
14
  name: string;
55
15
  label: string;
package/src/lib/Form/types.d.ts CHANGED
@@ -21,6 +21,7 @@ interface Checkbox {
21
21
  validateOption?: {
22
22
  required?: boolean;
23
23
  };
24
+ disabled?: boolean;
24
25
  muiProps?: {
25
26
  disabled?: boolean;
26
27
  size?: 'small' | 'medium' | 'large';
@@ -47,6 +48,7 @@ export interface FormItem {
47
48
  defaultValue?: string;
48
49
  icon?: string;
49
50
  option?: Options;
51
+ hiddenArrow?: boolean;
50
52
  radioOptions?: RadioOption[];
51
53
  direction?: 'horizontal' | 'vertical';
52
54
  step?: string;
@@ -68,6 +70,7 @@ export interface FormItem {
68
70
  fieldName?: string;
69
71
  authToken?: string;
70
72
  };
73
+ disabled?: boolean;
71
74
  }
72
75
  export interface FormType {
73
76
  item: FormItem;