@publishfx/publish-components 2.1.1 → 2.1.3

package/dist/TimePickerSelect/index.js

@@ -107,9 +107,10 @@ const TimePickerSelect = (props)=>{
                     },
                     children: options.map((option)=>{
                         const isSelected = currentValue.includes(option.value);
-                        return /*#__PURE__*/ jsxs("div", {
-                            className: `${index_module.optionItem} ${isSelected ? index_module.optionItemSelected : ""} ${option.disabled ? index_module.optionItemDisabled : ""}`,
-                            onClick: ()=>{
+                        return /*#__PURE__*/ jsx(Checkbox, {
+                            checked: isSelected,
+                            disabled: option.disabled,
+                            onChange: ()=>{
                                 if (option.disabled) return;
                                 const newValue = isSelected ? currentValue.filter((v)=>v !== option.value) : [
                                     ...currentValue,
@@ -117,27 +118,11 @@ const TimePickerSelect = (props)=>{
                                 ];
                                 handleChange(newValue);
                             },
-                            children: [
-                                /*#__PURE__*/ jsx("div", {
-                                    className: `${index_module.checkbox} ${isSelected ? index_module.checkboxChecked : ""}`,
-                                    children: isSelected && /*#__PURE__*/ jsx("svg", {
-                                        viewBox: "0 0 14 14",
-                                        fill: "none",
-                                        className: index_module.checkIcon,
-                                        children: /*#__PURE__*/ jsx("path", {
-                                            d: "M2.5 7L5.5 10L11.5 4",
-                                            stroke: "currentColor",
-                                            strokeWidth: "2",
-                                            strokeLinecap: "round",
-                                            strokeLinejoin: "round"
-                                        })
-                                    })
-                                }),
-                                /*#__PURE__*/ jsx("span", {
-                                    className: index_module.optionLabel,
-                                    children: option.label
-                                })
-                            ]
+                            className: `${index_module.optionCheckbox} ${isSelected ? index_module.optionCheckboxSelected : ""} ${option.disabled ? index_module.optionCheckboxDisabled : ""}`,
+                            children: /*#__PURE__*/ jsx("span", {
+                                className: index_module.optionLabel,
+                                children: option.label
+                            })
                         }, option.value);
                     })
                 })

package/dist/TimePickerSelect/index.module.js

@@ -12,12 +12,9 @@ const index_module = {
     selectAllText: "selectAllText-XhWUCP",
     clearBtn: "clearBtn-aUkoKx",
     optionsGrid: "optionsGrid-aFw9nI",
-    optionItem: "optionItem-hSQko7",
-    optionItemSelected: "optionItemSelected-gxv5lv",
-    optionLabel: "optionLabel-KSY4BV",
-    optionItemDisabled: "optionItemDisabled-fYreur",
-    checkbox: "checkbox-_flWUW",
-    checkboxChecked: "checkboxChecked-uaxISg",
-    checkIcon: "checkIcon-y7k1OL"
+    optionCheckbox: "optionCheckbox-FLZ7GF",
+    optionCheckboxSelected: "optionCheckboxSelected-FFTvH6",
+    optionCheckboxDisabled: "optionCheckboxDisabled-lcXcnC",
+    optionLabel: "optionLabel-KSY4BV"
 };
 export { index_module as default };

package/dist/TimePickerSelect/index_module.css

@@ -7,7 +7,7 @@
 }
 
 .selectLabel-j8XQLR {
-  color: #000000d9;
+  color: var(--color-text-1);
   font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif;
   font-size: 14px;
   font-weight: normal;
@@ -19,26 +19,26 @@
 }
 
 .timePickerSelect_select-xuD_LK .arco-select-view {
-  background-color: #fff;
-  border: 1px solid #d9d9d9;
-  border-radius: 2px;
+  background-color: var(--color-bg-2);
+  border: 1px solid var(--color-border-2);
+  border-radius: var(--border-radius-small);
   min-height: 32px;
   padding: 4px 12px;
   transition: all .2s;
 }
 
 .timePickerSelect_select-xuD_LK .arco-select-view:hover {
-  border-color: #40a9ff;
+  border-color: rgb(var(--primary-5));
 }
 
 .timePickerSelect_select-xuD_LK .arco-select-view-focused {
-  border-color: #1890ff;
-  box-shadow: 0 0 0 2px #1890ff33;
+  border-color: rgb(var(--primary-6));
+  box-shadow: 0 0 0 2px var(--color-primary-light-2);
 }
 
 .timePickerSelect_select-xuD_LK .arco-select-view-disabled {
+  background-color: var(--color-fill-2);
   cursor: not-allowed;
-  background-color: #fafafa;
 }
 
 .timePickerSelect_select-xuD_LK .arco-select-view-selector {
@@ -49,12 +49,12 @@
 }
 
 .timePickerSelect_select-xuD_LK .arco-select-view-placeholder {
-  color: #00000073;
+  color: var(--color-text-3);
   font-size: 14px;
 }
 
 .timePickerSelect_select-xuD_LK .arco-select-arrow-icon {
-  color: #00000073;
+  color: var(--color-text-2);
   font-size: 16px;
   transition: transform .2s;
 }
@@ -63,39 +63,39 @@
   transform: rotate(180deg);
 }
 
-.arco-tag {
-  color: #000000d9;
-  background-color: #fafafa;
-  border: 1px solid #d9d9d9;
-  border-radius: 2px;
+.timePickerSelect_select-xuD_LK .arco-tag {
+  background-color: var(--color-fill-2);
+  border: 1px solid var(--color-border-2);
+  border-radius: var(--border-radius-small);
+  height: 24px;
+  color: var(--color-text-1);
   align-items: center;
   gap: 4px;
-  height: 24px;
   padding: 0 8px;
   font-size: 12px;
   display: inline-flex;
 }
 
-.arco-tag .arco-tag-content {
+.timePickerSelect_select-xuD_LK .arco-tag .arco-tag-content {
   line-height: 1;
 }
 
-.arco-tag .arco-tag-icon-hover {
-  color: #00000073;
-  justify-content: center;
-  align-items: center;
+.timePickerSelect_select-xuD_LK .arco-tag .arco-tag-icon-hover {
   width: 12px;
   height: 12px;
+  color: var(--color-text-2);
+  justify-content: center;
+  align-items: center;
   margin-left: 0;
   transition: color .2s;
   display: flex;
 }
 
-.arco-tag .arco-tag-icon-hover:hover {
-  color: #000000a6;
+.timePickerSelect_select-xuD_LK .arco-tag .arco-tag-icon-hover:hover {
+  color: var(--color-text-1);
 }
 
-.arco-tag .arco-tag-icon-hover svg {
+.timePickerSelect_select-xuD_LK .arco-tag .arco-tag-icon-hover svg {
   font-size: 12px;
 }
 
@@ -107,16 +107,16 @@
 }
 
 .dropdownContent-OfV283 {
-  background-color: #fff;
-  border: 1px solid #d9d9d9;
-  border-radius: 2px;
+  background-color: var(--color-bg-2);
+  border: 1px solid var(--color-border-2);
+  border-radius: var(--border-radius-small);
+  box-shadow: var(--shadow2-down);
   min-width: 320px;
   padding: 8px;
-  box-shadow: 0 2px 8px #0000001a;
 }
 
 .dropdownHeader-nILpAL {
-  border-bottom: 1px solid #fafafa;
+  border-bottom: 1px solid var(--color-border-1);
   justify-content: space-between;
   align-items: center;
   height: 32px;
@@ -138,19 +138,19 @@
 }
 
 .dropdownHeader-nILpAL .selectAll-H78Ezl .selectAllText-XhWUCP {
-  color: #1890ff;
+  color: rgb(var(--primary-6));
   font-size: 14px;
 }
 
 .dropdownHeader-nILpAL .clearBtn-aUkoKx {
-  color: #00000073;
+  color: var(--color-text-3);
   cursor: pointer;
   font-size: 14px;
   transition: color .2s;
 }
 
 .dropdownHeader-nILpAL .clearBtn-aUkoKx:hover {
-  color: #1890ff;
+  color: rgb(var(--primary-6));
 }
 
 .optionsGrid-aFw9nI {
@@ -160,56 +160,56 @@
   overflow-y: auto;
 }
 
-.optionItem-hSQko7 {
-  cursor: pointer;
-  border-radius: 2px;
+.optionCheckbox-FLZ7GF {
+  border-radius: var(--border-radius-small);
   align-items: center;
-  gap: 4px;
   height: 32px;
+  margin: 0;
   padding: 0 4px;
   transition: background-color .2s;
   display: flex;
 }
 
-.optionItem-hSQko7:hover {
-  background-color: #fafafa;
+.optionCheckbox-FLZ7GF:hover {
+  background-color: var(--color-fill-2);
 }
 
-.optionItem-hSQko7.optionItemSelected-gxv5lv .optionLabel-KSY4BV {
-  color: #000000d9;
+.optionCheckbox-FLZ7GF .arco-checkbox-inner {
+  border-radius: var(--border-radius-small);
+  border-color: var(--color-border-2);
+  width: 16px;
+  height: 16px;
 }
 
-.optionItem-hSQko7.optionItemDisabled-fYreur {
-  opacity: .5;
-  cursor: not-allowed;
+.optionCheckbox-FLZ7GF .arco-checkbox-inner:after {
+  border-width: 2px;
+  width: 5px;
+  height: 9px;
+  top: 46%;
+  left: 24%;
 }
 
-.checkbox-_flWUW {
-  background-color: #fff;
-  border: 1px solid #d9d9d9;
-  border-radius: 2px;
-  flex-shrink: 0;
-  justify-content: center;
-  align-items: center;
-  width: 16px;
-  height: 16px;
-  transition: all .2s;
-  display: flex;
+.optionCheckbox-FLZ7GF.optionCheckboxSelected-FFTvH6 .arco-checkbox-inner {
+  background-color: rgb(var(--primary-6));
+  border-color: rgb(var(--primary-6));
 }
 
-.checkbox-_flWUW.checkboxChecked-uaxISg {
-  background-color: #1890ff;
-  border-color: #1890ff;
+.optionCheckbox-FLZ7GF.optionCheckboxDisabled-lcXcnC {
+  opacity: .5;
+  cursor: not-allowed;
 }
 
-.checkIcon-y7k1OL {
-  color: #fff;
-  width: 14px;
-  height: 14px;
+.optionCheckbox-FLZ7GF.optionCheckboxDisabled-lcXcnC .arco-checkbox-inner {
+  background-color: var(--color-fill-2);
+  border-color: var(--color-border-2);
+}
+
+.optionCheckbox-FLZ7GF .arco-checkbox-text {
+  margin-left: 4px;
 }
 
 .optionLabel-KSY4BV {
-  color: #000000d9;
+  color: var(--color-text-1);
   user-select: none;
   font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif;
   font-size: 14px;
@@ -224,11 +224,11 @@
 }
 
 .optionsGrid-aFw9nI::-webkit-scrollbar-thumb {
-  background: #d9d9d9;
+  background: var(--color-border-2);
   border-radius: 3px;
 }
 
 .optionsGrid-aFw9nI::-webkit-scrollbar-thumb:hover {
-  background: #00000073;
+  background: var(--color-text-3);
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@publishfx/publish-components",
-  "version": "2.1.1",
+  "version": "2.1.3",
   "description": "A React UI component library for the Publish platform, including ActionButton component",
   "type": "module",
   "keywords": [