@sunggang/ui-lib 0.3.4 → 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 +61 -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,10 +47194,27 @@ 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"
47204
+ });
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
+ },
47215
+ menuPortal: function(base) {
47216
+ return _object_spread_props$8(_object_spread$b({}, base), {
47217
+ zIndex: 9999
47199
47218
  });
47200
47219
  }
47201
47220
  };
@@ -47221,7 +47240,12 @@ var MultipleSelect = function(param) {
47221
47240
  options: newOptions,
47222
47241
  placeholder: (item === null || item === void 0 ? void 0 : item.placeholder) || "請選擇",
47223
47242
  styles: customStyles,
47224
- closeMenuOnSelect: false
47243
+ menuPortalTarget: typeof window !== "undefined" ? document.body : null,
47244
+ closeMenuOnSelect: false,
47245
+ noOptionsMessage: function() {
47246
+ return "沒有可選項目";
47247
+ },
47248
+ isDisabled: isDisabled
47225
47249
  }));
47226
47250
  }
47227
47251
  }),
@@ -47266,14 +47290,14 @@ var Time = function(param) {
47266
47290
  children: [
47267
47291
  /*#__PURE__*/ jsx("input", _object_spread$b(_object_spread_props$8(_object_spread$b({
47268
47292
  className: [
47269
- (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]",
47270
47294
  "customTime border border-solid border-gray-300 px-3 py-2 rounded-lg w-full text-[16px]"
47271
47295
  ].join(" "),
47272
47296
  type: (item === null || item === void 0 ? void 0 : item.type) || "time",
47273
47297
  placeholder: "ex: 16:00"
47274
47298
  }, register(item === null || item === void 0 ? void 0 : item.name, _object_spread$b({}, item === null || item === void 0 ? void 0 : item.validateOption))), {
47275
47299
  style: item === null || item === void 0 ? void 0 : item.style,
47276
- disabled: item === null || item === void 0 ? void 0 : item.disable,
47300
+ disabled: item === null || item === void 0 ? void 0 : item.disabled,
47277
47301
  id: item === null || item === void 0 ? void 0 : item.id,
47278
47302
  max: "2037-12-31T23:59"
47279
47303
  }), step, onInput)),
@@ -47321,7 +47345,7 @@ var City = function(param) {
47321
47345
  }),
47322
47346
  /*#__PURE__*/ jsx("div", {
47323
47347
  className: "absolute w-12 h-11 top-0 right-0 z-5 flex items-center justify-center rounded-r-lg pointer-events-none",
47324
- children: /*#__PURE__*/ jsx(Icon, {
47348
+ children: !(item === null || item === void 0 ? void 0 : item.hiddenArrow) && /*#__PURE__*/ jsx(Icon, {
47325
47349
  className: "h-6 w-6",
47326
47350
  icon: "ri:arrow-down-s-line",
47327
47351
  color: "6f6f6f"
@@ -47329,11 +47353,12 @@ var City = function(param) {
47329
47353
  }),
47330
47354
  /*#__PURE__*/ jsx("select", _object_spread_props$8(_object_spread$b({
47331
47355
  className: [
47332
- (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]",
47333
47357
  "customSelect w-full h-11 py-2 pr-4 rounded-lg border border-solid border-gray-300 pl-4 mr-6"
47334
47358
  ].join(" "),
47335
47359
  style: item === null || item === void 0 ? void 0 : item.style
47336
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,
47337
47362
  children: (CityDataMap === null || CityDataMap === void 0 ? void 0 : CityDataMap.length) && CityDataMap.map(function(v) {
47338
47363
  return /*#__PURE__*/ jsx("option", {
47339
47364
  value: v.value,
@@ -47374,7 +47399,9 @@ var CheckboxField = function(param) {
47374
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) {
47375
47400
  var _checkbox_validateOption;
47376
47401
  return /*#__PURE__*/ jsxs("div", {
47377
- className: "flex items-center gap-1 my-2",
47402
+ className: [
47403
+ "flex items-center gap-1 my-2"
47404
+ ].join(" "),
47378
47405
  children: [
47379
47406
  /*#__PURE__*/ jsx(Controller$2, {
47380
47407
  name: checkbox === null || checkbox === void 0 ? void 0 : checkbox.name,
@@ -47382,6 +47409,7 @@ var CheckboxField = function(param) {
47382
47409
  rules: (checkbox === null || checkbox === void 0 ? void 0 : (_checkbox_validateOption = checkbox.validateOption) === null || _checkbox_validateOption === void 0 ? void 0 : _checkbox_validateOption.required) ? {
47383
47410
  required: checkbox === null || checkbox === void 0 ? void 0 : checkbox.errorText
47384
47411
  } : undefined,
47412
+ disabled: checkbox.disabled,
47385
47413
  render: function(param) {
47386
47414
  var field = param.field;
47387
47415
  return /*#__PURE__*/ jsx(Checkbox, _object_spread_props$8(_object_spread$b({}, field, checkbox === null || checkbox === void 0 ? void 0 : checkbox.muiProps), {
@@ -47393,7 +47421,7 @@ var CheckboxField = function(param) {
47393
47421
  }
47394
47422
  }),
47395
47423
  /*#__PURE__*/ jsx("div", {
47396
- 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,
47397
47425
  children: checkbox === null || checkbox === void 0 ? void 0 : checkbox.checkboxLabel
47398
47426
  }),
47399
47427
  validateMsg(errors, checkbox) && /*#__PURE__*/ jsxs("div", {
@@ -47415,6 +47443,7 @@ var CheckboxField = function(param) {
47415
47443
  rules: (item === null || item === void 0 ? void 0 : (_item_validateOption = item.validateOption) === null || _item_validateOption === void 0 ? void 0 : _item_validateOption.required) ? {
47416
47444
  required: item === null || item === void 0 ? void 0 : item.errorText
47417
47445
  } : undefined,
47446
+ disabled: item.disable || (item === null || item === void 0 ? void 0 : item.disabled),
47418
47447
  render: function(param) {
47419
47448
  var field = param.field;
47420
47449
  return /*#__PURE__*/ jsx(Checkbox, _object_spread_props$8(_object_spread$b({}, field, item === null || item === void 0 ? void 0 : item.muiProps), {
@@ -47426,7 +47455,7 @@ var CheckboxField = function(param) {
47426
47455
  }
47427
47456
  }),
47428
47457
  /*#__PURE__*/ jsx("div", {
47429
- 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,
47430
47459
  children: item === null || item === void 0 ? void 0 : item.checkboxLabel
47431
47460
  }),
47432
47461
  validateMsg(errors, item) && /*#__PURE__*/ jsxs("div", {
@@ -47472,7 +47501,7 @@ var RadioField = function(param) {
47472
47501
  value: option === null || option === void 0 ? void 0 : option.value,
47473
47502
  control: /*#__PURE__*/ jsx(Radio, _object_spread$b({}, item === null || item === void 0 ? void 0 : item.muiProps)),
47474
47503
  label: option === null || option === void 0 ? void 0 : option.label,
47475
- 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
47476
47505
  }, index);
47477
47506
  })
47478
47507
  }));
@@ -47503,12 +47532,13 @@ var Textarea = function(param) {
47503
47532
  }),
47504
47533
  /*#__PURE__*/ jsx("textarea", _object_spread_props$8(_object_spread$b({
47505
47534
  className: [
47506
- (item === null || item === void 0 ? void 0 : item.disable) ? "text-[#B0B0B0] bg-[#E6E6E6] pointer-events-none" : "bg-white text-[#0f172a] pointer-events-auto",
47507
- "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]"
47508
47537
  ].join(" "),
47509
47538
  style: item === null || item === void 0 ? void 0 : item.style
47510
47539
  }, register(item.name, _object_spread$b({}, item === null || item === void 0 ? void 0 : item.validateOption))), {
47511
- 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)
47512
47542
  })),
47513
47543
  validateMsg(errors, item) && /*#__PURE__*/ jsxs("div", {
47514
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.4",
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;