gdp-color-picker 1.1.1 → 1.1.3

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 (14) hide show
  1. package/dist/index.css +1 -1
  2. package/dist/index.css.map +1 -1
  3. package/dist/index.js +1 -1
  4. package/dist/index.js.map +1 -1
  5. package/dist/index.modern.mjs +1 -1
  6. package/dist/index.modern.mjs.map +1 -1
  7. package/dist/index.module.js +1 -1
  8. package/dist/index.module.js.map +1 -1
  9. package/dist/index.umd.js +1 -1
  10. package/dist/index.umd.js.map +1 -1
  11. package/package.json +1 -1
  12. package/src/lib/ColorBoard.js +5 -2
  13. package/src/lib/index.css +9 -3
  14. package/src/lib/index.js +62 -28
package/dist/index.css CHANGED
@@ -1,2 +1,2 @@
1
- .color-picker-panel{background:#fff;border-radius:4px;box-shadow:0 2px 8px #00000026;padding:0 8px 8px;-webkit-user-select:none;user-select:none;width:222px}.color-board{border-radius:2px;cursor:pointer;height:150px;overflow:hidden;position:relative;width:100%}.color-board-white{background:linear-gradient(90deg,#fff,#fff0)}.color-board-black,.color-board-white{bottom:0;left:0;position:absolute;right:0;top:0}.color-board-black{background:linear-gradient(0deg,#000,#0000)}.color-board-handler{border:2px solid #fff;border-radius:50%;box-shadow:0 0 2px #00000080;height:10px;pointer-events:none;position:absolute;transform:translate(-50%,-50%);width:10px}.color-slider{border-radius:5px;cursor:pointer;height:10px;margin-top:8px;position:relative;width:100%}.color-slider-handler{background:#fff;border:1px solid #0000001a;border-radius:50%;box-shadow:0 0 2px #00000080;height:12px;pointer-events:none;position:absolute;top:50%;transform:translate(-50%,-50%);width:12px}.hue-slider{background:linear-gradient(90deg,red 0,#ff0 17%,lime 33%,cyan 50%,blue 66%,#f0f 83%,red)}.alpha-slider-bg{background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAIAAADZF8uwAAAAGUlEQVQYV2M4gwH+YwCzekwMjDjZ1IxjJwApDkHN9Fi7xwAAAABJRU5ErkJggg==")}.color-input-container{align-items:center;display:flex;flex-direction:row;gap:8px;margin-top:12px}.mode-selector{align-items:center;background-color:#fff;border:1px solid #d9d9d9;border-radius:4px;box-sizing:border-box;color:#333;cursor:pointer;display:flex;font-size:12px;height:24px;justify-content:space-between;min-width:60px;padding:4px 8px;position:relative;transition:all .3s;-webkit-user-select:none;user-select:none}.mode-selector:hover{border-color:#4096ff}.mode-dropdown{background:#fff;border:1px solid #d9d9d9;border-radius:4px;box-shadow:0 2px 8px #00000026;left:0;margin-top:4px;min-width:100%;position:absolute;top:100%;z-index:10}.mode-option{color:#333;cursor:pointer;font-size:12px;padding:5px 12px}.mode-option:hover{background:#f5f5f5}.color-input-fields{display:flex;flex:1;gap:6px}.hex-input-wrapper{align-items:center;background:#fff;border:1px solid #d9d9d9;border-radius:4px;box-sizing:border-box;display:flex;flex:1;height:24px;padding:0 8px;transition:border-color .3s}.hex-input-wrapper:focus-within,.hex-input-wrapper:hover{border-color:#4096ff}.hex-prefix{color:#bfbfbf;font-size:12px;margin-right:4px}.color-input{border:1px solid #d9d9d9;border-radius:4px;box-sizing:border-box;color:#333;font-size:12px;height:24px;padding:2px 0;text-align:center;width:100%}.color-input.hex{border:none;height:20px;outline:none;text-align:left}.color-input:focus{border-color:#4096ff;outline:none}.color-input::-webkit-inner-spin-button,.color-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.color-input[type=number]{-moz-appearance:textfield}.alpha-display{align-items:center;background-color:#f5f5f5;border:1px solid #d9d9d9;color:#666;display:flex;justify-content:center;text-align:center;width:40px}.color-picker-trigger{align-items:center;border:1px solid #0000;border-radius:4px;cursor:pointer;display:flex;margin-left:6px;transition:all .3s}.color-picker-trigger:hover{background-color:#0000000a}.color-block{border:1px solid #0000001a;border-radius:4px;box-shadow:0 0 2px #c5c5c5;height:16px;width:16px}.color-picker-container{align-items:flex-start;display:inline-flex;flex-direction:column;font-family:Arial,Microsoft Yahei,Helvetica Neue,Helvetica,sans-serif;font-size:14px;gap:8px;position:relative}.color-picker-main-row{align-items:center;display:flex;flex-wrap:nowrap;gap:0;width:100%}.color-picker-inline-presets{margin-top:8px;width:100%}.presets-grid.inline{display:grid;gap:8px;grid-template-columns:repeat(7,1fr);padding:4px}.color-picker-tooltip-trigger{align-items:center;border:1px solid #0000;border-radius:4px;display:inline-flex;gap:8px;position:relative;transition:all .3s}.tooltip-text{background-color:#000;border-radius:4px;bottom:110%;color:#fff;font-size:12px;left:77%;opacity:0;padding:5px 8px;position:absolute;text-align:center;transform:translateX(-50%);transition:opacity .3s;visibility:hidden;white-space:nowrap;z-index:1001}.tooltip-text:after{border:5px solid #0000;border-top-color:#000;content:"";left:50%;margin-left:-5px;position:absolute;top:100%}.color-picker-trigger:hover .tooltip-text{opacity:1;visibility:visible}.color-picker-trigger.is-open .tooltip-text{opacity:0;visibility:hidden}.color-picker-label{color:#ffffffa6}.color-picker-arrow{align-items:center;color:#8c8c8c;display:flex;margin-left:6px;transition:transform .3s}.color-picker-arrow img{display:block;height:12px;width:12px}.color-picker-arrow.open{transform:rotate(180deg)}.color-picker-input-wrapper{align-items:center;display:inline-flex;flex-shrink:0;position:relative}.color-picker-input-wrapper input{background-color:initial;border:1px solid #fff3;border-radius:4px;color:#fff;font-family:Arial,Microsoft Yahei,Helvetica Neue,Helvetica,sans-serif;font-size:14px;height:24px;outline:none;padding:4px 22px 4px 8px;transition:border-color .3s;width:140px}.color-picker-input-wrapper input:focus{border-color:#1677ff}.input-clear-icon{cursor:pointer;filter:invert(1);height:12px;opacity:.7;position:absolute;right:6px;top:50%;transform:translateY(-50%);transition:opacity .2s;width:12px}.input-clear-icon:hover{opacity:1}.color-picker-presets{padding-bottom:4px}.color-picker-icon-right{align-items:center;cursor:pointer;display:flex;float:right;justify-content:center;transition:transform .2s}.color-picker-icon-right:hover{transform:scale(1.1)}.palette-section-title{color:#999;font-size:12px;margin-bottom:5px;margin-top:5px}.presets-grid{display:grid;gap:8px;grid-template-columns:repeat(7,1fr);padding:4px}.preset-item{border:1px solid #0000001a;border-radius:4px;cursor:pointer;height:24px;transition:transform .1s,box-shadow .1s;width:24px}.preset-item-inner{height:20px;width:20px}.preset-item:hover{box-shadow:0 2px 4px #0003;transform:scale(1.15);z-index:1}.presets-collapse{align-items:center;color:#fff;cursor:pointer;display:flex;font-size:12px;gap:4px;justify-content:center}.collapse-arrow{display:inline-block;font-size:10px;opacity:.85;transition:transform .25s ease,color .25s ease,opacity .25s ease}.presets-collapse:hover .collapse-arrow{color:#1677ff;opacity:1;transform:translateY(1px)}.collapse-arrow.expanded{transform:rotate(180deg)}
1
+ .color-picker-panel{background:#fff;border-radius:4px;box-shadow:0 2px 8px #00000026;padding:0 8px 8px;-webkit-user-select:none;user-select:none;width:222px}.color-board{border-radius:2px;cursor:pointer;height:150px;overflow:hidden;position:relative;width:100%}.color-board-white{background:linear-gradient(90deg,#fff,#fff0)}.color-board-black,.color-board-white{bottom:0;left:0;position:absolute;right:0;top:0}.color-board-black{background:linear-gradient(0deg,#000,#0000)}.color-board-handler{border:2px solid #fff;border-radius:50%;box-shadow:0 0 2px #00000080;height:10px;pointer-events:none;position:absolute;transform:translate(-50%,-50%);width:10px}.color-slider{border-radius:5px;cursor:pointer;height:10px;margin-top:8px;position:relative;width:100%}.color-slider-handler{background:#fff;border:1px solid #0000001a;border-radius:50%;box-shadow:0 0 2px #00000080;height:12px;pointer-events:none;position:absolute;top:50%;transform:translate(-50%,-50%);width:12px}.hue-slider{background:linear-gradient(90deg,red 0,#ff0 17%,lime 33%,cyan 50%,blue 66%,#f0f 83%,red)}.alpha-slider-bg{background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAIAAADZF8uwAAAAGUlEQVQYV2M4gwH+YwCzekwMjDjZ1IxjJwApDkHN9Fi7xwAAAABJRU5ErkJggg==")}.color-input-container{align-items:center;display:flex;flex-direction:row;gap:8px;margin-top:12px}.mode-selector{align-items:center;background-color:#fff;border:1px solid #d9d9d9;border-radius:4px;box-sizing:border-box;color:#333;cursor:pointer;display:flex;font-size:12px;height:24px;justify-content:space-between;min-width:60px;padding:4px 8px;position:relative;transition:all .3s;-webkit-user-select:none;user-select:none}.mode-selector:hover{border-color:#4096ff}.mode-dropdown{background:#fff;border:1px solid #d9d9d9;border-radius:4px;box-shadow:0 2px 8px #00000026;left:0;margin-top:4px;min-width:100%;position:absolute;top:100%;z-index:10}.mode-option{color:#333;cursor:pointer;font-size:12px;padding:5px 12px}.mode-option:hover{background:#f5f5f5}.color-input-fields{display:flex;flex:1;gap:6px}.hex-input-wrapper{align-items:center;background:#fff;border:1px solid #d9d9d9;border-radius:4px;box-sizing:border-box;display:flex;flex:1;height:24px;padding:0 8px;transition:border-color .3s}.hex-input-wrapper:focus-within,.hex-input-wrapper:hover{border-color:#4096ff}.hex-prefix{color:#bfbfbf;font-size:12px;margin-right:4px}.color-input{border:1px solid #d9d9d9;border-radius:4px;box-sizing:border-box;color:#333;font-size:12px;height:24px;padding:2px 0;text-align:center;width:100%}.color-input.hex{border:none;height:20px;outline:none;text-align:left}.color-input:focus{border-color:#4096ff;outline:none}.color-input::-webkit-inner-spin-button,.color-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.color-input[type=number]{-moz-appearance:textfield}.alpha-display{align-items:center;background-color:#f5f5f5;border:1px solid #d9d9d9;color:#666;display:flex;justify-content:center;text-align:center;width:40px}.color-picker-trigger{align-items:center;border:1px solid #0000;border-radius:4px;cursor:pointer;display:flex;margin-left:6px;transition:all .3s}.color-picker-trigger:hover{background-color:#0000000a}.color-block{border:1px solid #0000001a;border-radius:4px;box-shadow:0 0 2px #c5c5c5;height:16px;width:16px}.color-picker-container{align-items:flex-start;display:inline-flex;flex-direction:column;font-family:Arial,Microsoft Yahei,Helvetica Neue,Helvetica,sans-serif;font-size:14px;gap:8px;position:relative}.color-picker-main-row{align-items:center;display:flex;flex-wrap:nowrap;gap:0;width:100%}.color-picker-inline-presets{margin-top:8px;width:100%}.presets-grid.inline{display:grid;gap:8px;grid-template-columns:repeat(7,1fr);padding:4px}.color-picker-tooltip-trigger{align-items:center;border:1px solid #0000;border-radius:4px;display:inline-flex;gap:8px;position:relative;transition:all .3s}.tooltip-text{background-color:#000;border-radius:4px;bottom:110%;color:#fff;font-size:12px;left:77%;opacity:0;padding:5px 8px;position:absolute;text-align:center;transform:translateX(-50%);transition:opacity .3s;visibility:hidden;white-space:nowrap;z-index:1001}.tooltip-text:after{border:5px solid #0000;border-top-color:#000;content:"";left:50%;margin-left:-5px;position:absolute;top:100%}.color-picker-trigger:hover .tooltip-text{opacity:1;visibility:visible}.color-picker-trigger.is-open .tooltip-text{opacity:0;visibility:hidden}.color-picker-label{color:#ffffffa6}.color-picker-arrow{align-items:center;color:#8c8c8c;display:flex;margin-left:6px;transition:transform .3s}.color-picker-arrow img{display:block;height:12px;width:12px}.color-picker-arrow.open{transform:rotate(180deg)}.color-picker-input-wrapper{align-items:center;display:inline-flex;flex-shrink:0;position:relative}.color-picker-input-wrapper input{background-color:initial;border:1px solid #fff3;border-radius:4px;color:#fff;font-family:Arial,Microsoft Yahei,Helvetica Neue,Helvetica,sans-serif;font-size:14px;height:24px;outline:none;padding:4px 22px 4px 8px;transition:border-color .3s;width:140px}.color-picker-input-wrapper input:focus{border-color:#1677ff}.input-clear-icon{cursor:pointer;filter:invert(1);height:12px;opacity:.7;position:absolute;right:6px;top:30%;transform:translateY(-50%);transition:opacity .2s;width:12px}.input-clear-icon:hover{opacity:1}.color-picker-presets{padding-bottom:4px}.color-picker-icon-right{align-items:center;cursor:pointer;display:flex;float:right;justify-content:center;transition:transform .2s}.color-picker-icon-right:hover{transform:scale(1.1)}.palette-section-title{color:#999;font-size:12px;margin-bottom:5px;margin-top:5px}.presets-grid{display:grid;gap:8px;grid-template-columns:repeat(7,1fr);padding:4px}.preset-item{border:1px solid #0000001a;border-radius:4px;cursor:pointer;height:24px;transition:transform .1s,box-shadow .1s;width:24px}.preset-item-inner{height:20px;width:20px}.preset-item:hover{box-shadow:0 2px 4px #0003;transform:scale(1.15);z-index:1}.presets-collapse{align-items:center;color:#fff;cursor:pointer;display:flex;font-size:12px;gap:4px;justify-content:center}.collapse-arrow{display:inline-block;font-size:10px;height:12px;line-height:12px;opacity:.85;position:relative;text-align:center;top:0;transition:transform .25s ease,color .25s ease,opacity .25s ease,top .25s ease;width:12px}.presets-collapse:hover .collapse-arrow{color:#1677ff;opacity:1;top:1px}.collapse-arrow.expanded{transform:rotate(180deg)}
2
2
  /*# sourceMappingURL=index.css.map */
package/dist/index.css.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["index.css"],"names":[],"mappings":"AAAA,oBAGE,eAAgB,CAChB,iBAAkB,CAClB,8BAAyC,CAHzC,iBAAsB,CAItB,wBAAiB,CAAjB,gBAAiB,CALjB,WAMF,CAEA,aAIE,iBAAkB,CAClB,cAAe,CAFf,YAAa,CAGb,eAAgB,CALhB,iBAAkB,CAClB,UAKF,CAEA,mBAME,4CACF,CAEA,sCAJE,QAAS,CAFT,MAAO,CAFP,iBAAkB,CAGlB,OAAQ,CAFR,KAcF,CAPA,mBAME,2CACF,CAEA,qBAIE,qBAAsB,CACtB,iBAAkB,CAElB,4BAAsC,CAJtC,WAAY,CAKZ,mBAAoB,CAPpB,iBAAkB,CAKlB,8BAAgC,CAJhC,UAOF,CAEA,cAKE,iBAAkB,CAClB,cAAe,CAHf,WAAY,CACZ,cAAe,CAHf,iBAAkB,CAClB,UAKF,CAEA,sBAKE,eAAgB,CAKhB,0BAAoC,CAJpC,iBAAkB,CAElB,4BAAsC,CAJtC,WAAY,CAKZ,mBAAoB,CARpB,iBAAkB,CAClB,OAAQ,CAKR,8BAAgC,CAJhC,UAQF,CAEA,YACE,wFAUF,CAEA,iBACE,8JACF,CAEA,uBAIE,kBAAmB,CAFnB,YAAa,CACb,kBAAmB,CAEnB,OAAQ,CAJR,eAKF,CAEA,eAUE,kBAAmB,CAKnB,qBAAsB,CATtB,wBAAyB,CACzB,iBAAkB,CAOlB,qBAAsB,CAVtB,UAAW,CAFX,cAAe,CAOf,YAAa,CANb,cAAe,CAUf,WAAY,CAFZ,6BAA8B,CAC9B,cAAe,CAPf,eAAgB,CAJhB,iBAAkB,CAelB,kBAAoB,CARpB,wBAAiB,CAAjB,gBASF,CAEA,qBACE,oBACF,CAEA,eAIE,eAAgB,CAChB,wBAAyB,CACzB,iBAAkB,CAClB,8BAAyC,CAJzC,MAAO,CAOP,cAAe,CADf,cAAe,CARf,iBAAkB,CAClB,QAAS,CAMT,UAGF,CAEA,aAIE,UAAW,CAFX,cAAe,CACf,cAAe,CAFf,gBAIF,CAEA,mBACE,kBACF,CAEA,oBACE,YAAa,CAEb,MAAO,CADP,OAEF,CAEA,mBAEE,kBAAmB,CAOnB,eAAgB,CANhB,wBAAyB,CACzB,iBAAkB,CAIlB,qBAAsB,CAPtB,YAAa,CAKb,MAAO,CACP,WAAY,CAFZ,aAAc,CAKd,2BACF,CAEA,yDAEE,oBACF,CAEA,YACE,aAAc,CAEd,cAAe,CADf,gBAEF,CAEA,aAGE,wBAAyB,CACzB,iBAAkB,CAElB,qBAAsB,CAGtB,UAAW,CAJX,cAAe,CAGf,WAAY,CANZ,aAAc,CAKd,iBAAkB,CANlB,UASF,CAEA,iBACE,WAAY,CAEZ,WAAY,CACZ,YAAa,CAFb,eAGF,CAEA,mBACE,oBAAqB,CACrB,YACF,CAEA,gFAEE,uBAAwB,CACxB,QACF,CAEA,0BACE,yBACF,CAEA,eAOE,kBAAmB,CAJnB,wBAAyB,CAEzB,wBAAyB,CADzB,UAAW,CAEX,YAAa,CAEb,sBAAuB,CANvB,iBAAkB,CADlB,UAQF,CAEA,sBAEE,kBAAmB,CACnB,sBAA6B,CAC7B,iBAAkB,CAClB,cAAe,CAJf,YAAa,CAMb,eAAgB,CADhB,kBAEF,CAEA,4BACE,0BACF,CAEA,aAKE,0BAAoC,CAFpC,iBAAkB,CAClB,0BAA2B,CAF3B,WAAY,CADZ,UAKF,CAEA,wBAGE,sBAAuB,CAFvB,mBAAoB,CACpB,qBAAsB,CAGtB,qEAA8E,CAC9E,cAAe,CAFf,OAAQ,CAGR,iBACF,CAEA,uBAEE,kBAAmB,CADnB,YAAa,CAGb,gBAAiB,CADjB,KAAQ,CAER,UACF,CAEA,6BACE,cAAe,CACf,UACF,CAEA,qBACE,YAAa,CACb,OAAQ,CAER,mCAAqC,CADrC,WAEF,CAEA,8BAGE,kBAAmB,CAEnB,sBAA6B,CAC7B,iBAAkB,CAJlB,mBAAoB,CAEpB,OAAQ,CAHR,iBAAkB,CAMlB,kBACF,CAEA,cAEE,qBAAsB,CAGtB,iBAAkB,CAIlB,WAAY,CANZ,UAAW,CAWX,cAAe,CAJf,QAAS,CAET,SAAU,CANV,eAAgB,CAChB,iBAAkB,CAHlB,iBAAkB,CAOlB,0BAA2B,CAE3B,sBAAwB,CAZxB,iBAAkB,CAclB,kBAAmB,CAPnB,YAQF,CAEA,oBAQE,sBAAsD,CAAtD,qBAAsD,CAPtD,UAAW,CAGX,QAAS,CACT,gBAAiB,CAHjB,iBAAkB,CAClB,QAMF,CAEA,0CAEE,SAAU,CADV,kBAEF,CAEA,4CAEE,SAAU,CADV,iBAEF,CAEA,oBACE,eACF,CAEA,oBAIE,kBAAmB,CAFnB,aAAc,CACd,YAAa,CAFb,eAAgB,CAIhB,wBACF,CAEA,wBAGE,aAAc,CADd,WAAY,CADZ,UAGF,CAEA,yBACE,wBACF,CAEA,4BAGE,kBAAmB,CADnB,mBAAoB,CAEpB,aAAc,CAHd,iBAIF,CAEA,kCAQE,wBAA6B,CAL7B,sBAA0C,CAC1C,iBAAkB,CAGlB,UAAW,CAGX,qEAA8E,CAJ9E,cAAe,CAKf,WAAY,CANZ,YAAa,CAHb,wBAAyB,CAOzB,2BAA6B,CAR7B,WAWF,CAEA,wCACE,oBACF,CAEA,kBAOE,cAAe,CAGf,gBAAiB,CAJjB,WAAY,CAEZ,UAAY,CAPZ,iBAAkB,CAClB,SAAU,CACV,OAAQ,CACR,0BAA2B,CAK3B,sBAAwB,CAJxB,UAMF,CAEA,wBACE,SACF,CAEA,sBACE,kBACF,CACA,yBAGE,kBAAmB,CAEnB,cAAe,CAHf,YAAa,CADb,WAAY,CAGZ,sBAAuB,CAEvB,wBACF,CAEA,+BACE,oBACF,CACA,uBAEE,UAAW,CADX,cAAe,CAEf,iBAAkB,CAClB,cACF,CAEA,cACE,YAAa,CACb,OAAQ,CAER,mCAAqC,CADrC,WAEF,CAEA,aAKE,0BAAoC,CAFpC,iBAAkB,CAClB,cAAe,CAFf,WAAY,CAIZ,uCAA2C,CAL3C,UAMF,CACA,mBAEE,WAAY,CADZ,UAEF,CACA,mBAEE,0BAAwC,CADxC,qBAAsB,CAEtB,SACF,CACA,kBAEE,kBAAmB,CAGnB,UAAY,CADZ,cAAe,CAHf,YAAa,CAKb,cAAe,CACf,OAAQ,CAJR,sBAKF,CAEA,gBACE,oBAAqB,CACrB,cAAe,CAEf,WAAa,CADb,gEAEF,CAEA,wCACE,aAAc,CACd,SAAU,CACV,yBACF,CAEA,yBACE,wBACF","file":"index.css","sourcesContent":[".color-picker-panel {\n width: 222px;\n padding: 0 8px 8px 8px;\n background: #fff;\n border-radius: 4px;\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);\n user-select: none;\n}\n\n.color-board {\n position: relative;\n width: 100%;\n height: 150px;\n border-radius: 2px;\n cursor: pointer;\n overflow: hidden;\n}\n\n.color-board-white {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background: linear-gradient(to right, #fff, rgba(255, 255, 255, 0));\n}\n\n.color-board-black {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background: linear-gradient(to top, #000, rgba(0, 0, 0, 0));\n}\n\n.color-board-handler {\n position: absolute;\n width: 10px;\n height: 10px;\n border: 2px solid #fff;\n border-radius: 50%;\n transform: translate(-50%, -50%);\n box-shadow: 0 0 2px rgba(0, 0, 0, 0.5);\n pointer-events: none;\n}\n\n.color-slider {\n position: relative;\n width: 100%;\n height: 10px;\n margin-top: 8px;\n border-radius: 5px;\n cursor: pointer;\n}\n\n.color-slider-handler {\n position: absolute;\n top: 50%;\n width: 12px;\n height: 12px;\n background: #fff;\n border-radius: 50%;\n transform: translate(-50%, -50%);\n box-shadow: 0 0 2px rgba(0, 0, 0, 0.5);\n pointer-events: none;\n border: 1px solid rgba(0, 0, 0, 0.1);\n}\n\n.hue-slider {\n background: linear-gradient(\n to right,\n red 0%,\n #ff0 17%,\n lime 33%,\n cyan 50%,\n blue 66%,\n magenta 83%,\n red 100%\n );\n}\n\n.alpha-slider-bg {\n background-image: url(\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAIAAADZF8uwAAAAGUlEQVQYV2M4gwH+YwCzekwMjDjZ1IxjJwApDkHN9Fi7xwAAAABJRU5ErkJggg==\");\n}\n\n.color-input-container {\n margin-top: 12px;\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: 8px;\n}\n\n.mode-selector {\n position: relative;\n cursor: pointer;\n font-size: 12px;\n color: #333;\n padding: 4px 8px;\n border: 1px solid #d9d9d9;\n border-radius: 4px;\n user-select: none;\n display: flex;\n align-items: center;\n justify-content: space-between;\n min-width: 60px;\n height: 24px;\n box-sizing: border-box;\n background-color: #fff;\n transition: all 0.3s;\n}\n\n.mode-selector:hover {\n border-color: #4096ff;\n}\n\n.mode-dropdown {\n position: absolute;\n top: 100%;\n left: 0;\n background: #fff;\n border: 1px solid #d9d9d9;\n border-radius: 4px;\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);\n z-index: 10;\n min-width: 100%;\n margin-top: 4px;\n}\n\n.mode-option {\n padding: 5px 12px;\n cursor: pointer;\n font-size: 12px;\n color: #333;\n}\n\n.mode-option:hover {\n background: #f5f5f5;\n}\n\n.color-input-fields {\n display: flex;\n gap: 6px;\n flex: 1;\n}\n\n.hex-input-wrapper {\n display: flex;\n align-items: center;\n border: 1px solid #d9d9d9;\n border-radius: 4px;\n padding: 0 8px;\n flex: 1;\n height: 24px;\n box-sizing: border-box;\n background: #fff;\n transition: border-color 0.3s;\n}\n\n.hex-input-wrapper:hover,\n.hex-input-wrapper:focus-within {\n border-color: #4096ff;\n}\n\n.hex-prefix {\n color: #bfbfbf;\n margin-right: 4px;\n font-size: 12px;\n}\n\n.color-input {\n width: 100%;\n padding: 2px 0;\n border: 1px solid #d9d9d9;\n border-radius: 4px;\n font-size: 12px;\n box-sizing: border-box;\n text-align: center;\n height: 24px;\n color: #333;\n}\n\n.color-input.hex {\n border: none;\n text-align: left;\n height: 20px;\n outline: none;\n}\n\n.color-input:focus {\n border-color: #4096ff;\n outline: none;\n}\n\n.color-input::-webkit-outer-spin-button,\n.color-input::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0;\n}\n\n.color-input[type=\"number\"] {\n -moz-appearance: textfield;\n}\n\n.alpha-display {\n width: 40px;\n text-align: center;\n background-color: #f5f5f5;\n color: #666;\n border: 1px solid #d9d9d9;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.color-picker-trigger {\n display: flex;\n align-items: center;\n border: 1px solid transparent;\n border-radius: 4px;\n cursor: pointer;\n transition: all 0.3s;\n margin-left: 6px;\n}\n\n.color-picker-trigger:hover {\n background-color: rgba(0, 0, 0, 0.04);\n}\n\n.color-block {\n width: 16px;\n height: 16px;\n border-radius: 4px;\n box-shadow: 0 0 2px #c5c5c5;\n border: 1px solid rgba(0, 0, 0, 0.1);\n}\n\n.color-picker-container {\n display: inline-flex;\n flex-direction: column;\n align-items: flex-start;\n gap: 8px;\n font-family: Arial, \"Microsoft Yahei\", \"Helvetica Neue\", Helvetica, sans-serif;\n font-size: 14px;\n position: relative;\n}\n\n.color-picker-main-row {\n display: flex;\n align-items: center;\n gap: 0px;\n flex-wrap: nowrap;\n width: 100%;\n}\n\n.color-picker-inline-presets {\n margin-top: 8px;\n width: 100%;\n}\n\n.presets-grid.inline {\n display: grid;\n gap: 8px;\n padding: 4px;\n grid-template-columns: repeat(7, 1fr);\n}\n\n.color-picker-tooltip-trigger {\n position: relative;\n display: inline-flex;\n align-items: center;\n gap: 8px;\n border: 1px solid transparent;\n border-radius: 4px;\n transition: all 0.3s;\n}\n\n.tooltip-text {\n visibility: hidden;\n background-color: #000;\n color: #fff;\n text-align: center;\n border-radius: 4px;\n padding: 5px 8px;\n position: absolute;\n z-index: 1001;\n bottom: 110%;\n left: 77%;\n transform: translateX(-50%);\n opacity: 0;\n transition: opacity 0.3s;\n font-size: 12px;\n white-space: nowrap;\n}\n\n.tooltip-text::after {\n content: \"\";\n position: absolute;\n top: 100%;\n left: 50%;\n margin-left: -5px;\n border-width: 5px;\n border-style: solid;\n border-color: #000 transparent transparent transparent;\n}\n\n.color-picker-trigger:hover .tooltip-text {\n visibility: visible;\n opacity: 1;\n}\n\n.color-picker-trigger.is-open .tooltip-text {\n visibility: hidden;\n opacity: 0;\n}\n\n.color-picker-label {\n color: rgba(255, 255, 255, 0.65);\n}\n\n.color-picker-arrow {\n margin-left: 6px;\n color: #8c8c8c;\n display: flex;\n align-items: center;\n transition: transform 0.3s;\n}\n\n.color-picker-arrow img {\n width: 12px;\n height: 12px;\n display: block;\n}\n\n.color-picker-arrow.open {\n transform: rotate(180deg);\n}\n\n.color-picker-input-wrapper {\n position: relative;\n display: inline-flex;\n align-items: center;\n flex-shrink: 0;\n}\n\n.color-picker-input-wrapper input {\n width: 140px;\n padding: 4px 22px 4px 8px;\n border: 1px solid rgba(255, 255, 255, 0.2);\n border-radius: 4px;\n outline: none;\n font-size: 14px;\n color: #fff;\n background-color: transparent;\n transition: border-color 0.3s;\n font-family: Arial, \"Microsoft Yahei\", \"Helvetica Neue\", Helvetica, sans-serif;\n height: 24px;\n}\n\n.color-picker-input-wrapper input:focus {\n border-color: #1677ff;\n}\n\n.input-clear-icon {\n position: absolute;\n right: 6px;\n top: 50%;\n transform: translateY(-50%);\n width: 12px;\n height: 12px;\n cursor: pointer;\n opacity: 0.7;\n transition: opacity 0.2s;\n filter: invert(1);\n}\n\n.input-clear-icon:hover {\n opacity: 1;\n}\n\n.color-picker-presets {\n padding-bottom: 4px;\n}\n.color-picker-icon-right {\n float: right;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n transition: transform 0.2s;\n}\n\n.color-picker-icon-right:hover {\n transform: scale(1.1);\n}\n.palette-section-title {\n font-size: 12px;\n color: #999;\n margin-bottom: 5px;\n margin-top: 5px;\n}\n\n.presets-grid {\n display: grid;\n gap: 8px;\n padding: 4px;\n grid-template-columns: repeat(7, 1fr);\n}\n\n.preset-item {\n width: 24px;\n height: 24px;\n border-radius: 4px;\n cursor: pointer;\n border: 1px solid rgba(0, 0, 0, 0.1);\n transition: transform 0.1s, box-shadow 0.1s;\n}\n.preset-item-inner {\n width: 20px;\n height: 20px;\n}\n.preset-item:hover {\n transform: scale(1.15);\n box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);\n z-index: 1;\n}\n.presets-collapse {\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n color: white;\n font-size: 12px;\n gap: 4px;\n}\n\n.collapse-arrow {\n display: inline-block;\n font-size: 10px;\n transition: transform 0.25s ease, color 0.25s ease, opacity 0.25s ease;\n opacity: 0.85;\n}\n\n.presets-collapse:hover .collapse-arrow {\n color: #1677ff;\n opacity: 1;\n transform: translateY(1px);\n}\n\n.collapse-arrow.expanded {\n transform: rotate(180deg);\n}\n"]}
1
+ {"version":3,"sources":["index.css"],"names":[],"mappings":"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","file":"index.css","sourcesContent":[".color-picker-panel {\n width: 222px;\n padding: 0 8px 8px 8px;\n background: #fff;\n border-radius: 4px;\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);\n user-select: none;\n}\n\n.color-board {\n position: relative;\n width: 100%;\n height: 150px;\n border-radius: 2px;\n cursor: pointer;\n overflow: hidden;\n}\n\n.color-board-white {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background: linear-gradient(to right, #fff, rgba(255, 255, 255, 0));\n}\n\n.color-board-black {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background: linear-gradient(to top, #000, rgba(0, 0, 0, 0));\n}\n\n.color-board-handler {\n position: absolute;\n width: 10px;\n height: 10px;\n border: 2px solid #fff;\n border-radius: 50%;\n transform: translate(-50%, -50%);\n box-shadow: 0 0 2px rgba(0, 0, 0, 0.5);\n pointer-events: none;\n}\n\n.color-slider {\n position: relative;\n width: 100%;\n height: 10px;\n margin-top: 8px;\n border-radius: 5px;\n cursor: pointer;\n}\n\n.color-slider-handler {\n position: absolute;\n top: 50%;\n width: 12px;\n height: 12px;\n background: #fff;\n border-radius: 50%;\n transform: translate(-50%, -50%);\n box-shadow: 0 0 2px rgba(0, 0, 0, 0.5);\n pointer-events: none;\n border: 1px solid rgba(0, 0, 0, 0.1);\n}\n\n.hue-slider {\n background: linear-gradient(\n to right,\n red 0%,\n #ff0 17%,\n lime 33%,\n cyan 50%,\n blue 66%,\n magenta 83%,\n red 100%\n );\n}\n\n.alpha-slider-bg {\n background-image: url(\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAIAAADZF8uwAAAAGUlEQVQYV2M4gwH+YwCzekwMjDjZ1IxjJwApDkHN9Fi7xwAAAABJRU5ErkJggg==\");\n}\n\n.color-input-container {\n margin-top: 12px;\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: 8px;\n}\n\n.mode-selector {\n position: relative;\n cursor: pointer;\n font-size: 12px;\n color: #333;\n padding: 4px 8px;\n border: 1px solid #d9d9d9;\n border-radius: 4px;\n user-select: none;\n display: flex;\n align-items: center;\n justify-content: space-between;\n min-width: 60px;\n height: 24px;\n box-sizing: border-box;\n background-color: #fff;\n transition: all 0.3s;\n}\n\n.mode-selector:hover {\n border-color: #4096ff;\n}\n\n.mode-dropdown {\n position: absolute;\n top: 100%;\n left: 0;\n background: #fff;\n border: 1px solid #d9d9d9;\n border-radius: 4px;\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);\n z-index: 10;\n min-width: 100%;\n margin-top: 4px;\n}\n\n.mode-option {\n padding: 5px 12px;\n cursor: pointer;\n font-size: 12px;\n color: #333;\n}\n\n.mode-option:hover {\n background: #f5f5f5;\n}\n\n.color-input-fields {\n display: flex;\n gap: 6px;\n flex: 1;\n}\n\n.hex-input-wrapper {\n display: flex;\n align-items: center;\n border: 1px solid #d9d9d9;\n border-radius: 4px;\n padding: 0 8px;\n flex: 1;\n height: 24px;\n box-sizing: border-box;\n background: #fff;\n transition: border-color 0.3s;\n}\n\n.hex-input-wrapper:hover,\n.hex-input-wrapper:focus-within {\n border-color: #4096ff;\n}\n\n.hex-prefix {\n color: #bfbfbf;\n margin-right: 4px;\n font-size: 12px;\n}\n\n.color-input {\n width: 100%;\n padding: 2px 0;\n border: 1px solid #d9d9d9;\n border-radius: 4px;\n font-size: 12px;\n box-sizing: border-box;\n text-align: center;\n height: 24px;\n color: #333;\n}\n\n.color-input.hex {\n border: none;\n text-align: left;\n height: 20px;\n outline: none;\n}\n\n.color-input:focus {\n border-color: #4096ff;\n outline: none;\n}\n\n.color-input::-webkit-outer-spin-button,\n.color-input::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0;\n}\n\n.color-input[type=\"number\"] {\n -moz-appearance: textfield;\n}\n\n.alpha-display {\n width: 40px;\n text-align: center;\n background-color: #f5f5f5;\n color: #666;\n border: 1px solid #d9d9d9;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.color-picker-trigger {\n display: flex;\n align-items: center;\n border: 1px solid transparent;\n border-radius: 4px;\n cursor: pointer;\n transition: all 0.3s;\n margin-left: 6px;\n}\n\n.color-picker-trigger:hover {\n background-color: rgba(0, 0, 0, 0.04);\n}\n\n.color-block {\n width: 16px;\n height: 16px;\n border-radius: 4px;\n box-shadow: 0 0 2px #c5c5c5;\n border: 1px solid rgba(0, 0, 0, 0.1);\n}\n\n.color-picker-container {\n display: inline-flex;\n flex-direction: column;\n align-items: flex-start;\n gap: 8px;\n font-family: Arial, \"Microsoft Yahei\", \"Helvetica Neue\", Helvetica, sans-serif;\n font-size: 14px;\n position: relative;\n}\n\n.color-picker-main-row {\n display: flex;\n align-items: center;\n gap: 0px;\n flex-wrap: nowrap;\n width: 100%;\n}\n\n.color-picker-inline-presets {\n margin-top: 8px;\n width: 100%;\n}\n\n.presets-grid.inline {\n display: grid;\n gap: 8px;\n padding: 4px;\n grid-template-columns: repeat(7, 1fr);\n}\n\n.color-picker-tooltip-trigger {\n position: relative;\n display: inline-flex;\n align-items: center;\n gap: 8px;\n border: 1px solid transparent;\n border-radius: 4px;\n transition: all 0.3s;\n}\n\n.tooltip-text {\n visibility: hidden;\n background-color: #000;\n color: #fff;\n text-align: center;\n border-radius: 4px;\n padding: 5px 8px;\n position: absolute;\n z-index: 1001;\n bottom: 110%;\n left: 77%;\n transform: translateX(-50%);\n opacity: 0;\n transition: opacity 0.3s;\n font-size: 12px;\n white-space: nowrap;\n}\n\n.tooltip-text::after {\n content: \"\";\n position: absolute;\n top: 100%;\n left: 50%;\n margin-left: -5px;\n border-width: 5px;\n border-style: solid;\n border-color: #000 transparent transparent transparent;\n}\n\n.color-picker-trigger:hover .tooltip-text {\n visibility: visible;\n opacity: 1;\n}\n\n.color-picker-trigger.is-open .tooltip-text {\n visibility: hidden;\n opacity: 0;\n}\n\n.color-picker-label {\n color: rgba(255, 255, 255, 0.65);\n}\n\n.color-picker-arrow {\n margin-left: 6px;\n color: #8c8c8c;\n display: flex;\n align-items: center;\n transition: transform 0.3s;\n}\n\n.color-picker-arrow img {\n width: 12px;\n height: 12px;\n display: block;\n}\n\n.color-picker-arrow.open {\n transform: rotate(180deg);\n}\n\n.color-picker-input-wrapper {\n position: relative;\n display: inline-flex;\n align-items: center;\n flex-shrink: 0;\n}\n\n.color-picker-input-wrapper input {\n width: 140px;\n padding: 4px 22px 4px 8px;\n border: 1px solid rgba(255, 255, 255, 0.2);\n border-radius: 4px;\n outline: none;\n font-size: 14px;\n color: #fff;\n background-color: transparent;\n transition: border-color 0.3s;\n font-family: Arial, \"Microsoft Yahei\", \"Helvetica Neue\", Helvetica, sans-serif;\n height: 24px;\n}\n\n.color-picker-input-wrapper input:focus {\n border-color: #1677ff;\n}\n\n.input-clear-icon {\n position: absolute;\n right: 6px;\n top: 30%;\n transform: translateY(-50%);\n width: 12px;\n height: 12px;\n cursor: pointer;\n opacity: 0.7;\n transition: opacity 0.2s;\n filter: invert(1);\n}\n\n.input-clear-icon:hover {\n opacity: 1;\n}\n\n.color-picker-presets {\n padding-bottom: 4px;\n}\n.color-picker-icon-right {\n float: right;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n transition: transform 0.2s;\n}\n\n.color-picker-icon-right:hover {\n transform: scale(1.1);\n}\n.palette-section-title {\n font-size: 12px;\n color: #999;\n margin-bottom: 5px;\n margin-top: 5px;\n}\n\n.presets-grid {\n display: grid;\n gap: 8px;\n padding: 4px;\n grid-template-columns: repeat(7, 1fr);\n}\n\n.preset-item {\n width: 24px;\n height: 24px;\n border-radius: 4px;\n cursor: pointer;\n border: 1px solid rgba(0, 0, 0, 0.1);\n transition: transform 0.1s, box-shadow 0.1s;\n}\n.preset-item-inner {\n width: 20px;\n height: 20px;\n}\n.preset-item:hover {\n transform: scale(1.15);\n box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);\n z-index: 1;\n}\n.presets-collapse {\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n color: white;\n font-size: 12px;\n gap: 4px;\n}\n\n.collapse-arrow {\n display: inline-block;\n font-size: 10px;\n width: 12px;\n height: 12px;\n line-height: 12px;\n text-align: center;\n position: relative;\n top: 0;\n transition: transform 0.25s ease, color 0.25s ease, opacity 0.25s ease, top 0.25s ease;\n opacity: 0.85;\n}\n\n.presets-collapse:hover .collapse-arrow {\n color: #1677ff;\n opacity: 1;\n top: 1px;\n}\n\n.collapse-arrow.expanded {\n transform: rotate(180deg);\n}\n"]}
package/dist/index.js CHANGED
@@ -1,2 +1,2 @@
1
- var e=require("react"),t=require("react-dom");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=/*#__PURE__*/a(e),l=/*#__PURE__*/a(t);function r(){return r=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var a=arguments[t];for(var n in a)({}).hasOwnProperty.call(a,n)&&(e[n]=a[n])}return e},r.apply(null,arguments)}function o(e,t,a){return Math.min(Math.max(e,t),a)}function s(e,t,a){let n,l,r;e=(e%360+360)%360;let o=Math.floor(e/60),s=e/60-o,c=a*(1-t),u=a*(1-s*t),i=a*(1-(1-s)*t);switch(o%6){case 0:n=a,l=i,r=c;break;case 1:n=u,l=a,r=c;break;case 2:n=c,l=a,r=i;break;case 3:n=c,l=u,r=a;break;case 4:n=i,l=c,r=a;break;case 5:n=a,l=c,r=u;break;default:n=0,l=0,r=0}return{r:Math.round(255*n),g:Math.round(255*l),b:Math.round(255*r)}}function c(e,t,a){e/=255,t/=255,a/=255;let n,l,r=Math.max(e,t,a),o=Math.min(e,t,a),s=r,c=r-o;if(l=0===r?0:c/r,r===o)n=0;else{switch(r){case e:n=(t-a)/c+(t<a?6:0);break;case t:n=(a-e)/c+2;break;case a:n=(e-t)/c+4;break;default:n=0}n/=6}return{h:360*n,s:l,v:s}}function u(e,t,a){const n=e=>{const t=Math.round(e).toString(16);return 1===t.length?"0"+t:t};return"#"+n(e)+n(t)+n(a)}function i(e){e=e.replace(/^#?([a-f\d])([a-f\d])([a-f\d])$/i,function(e,t,a,n){return t+t+a+a+n+n});const t=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(e);return t?{r:parseInt(t[1],16),g:parseInt(t[2],16),b:parseInt(t[3],16)}:null}function d(e){if(!e)return{h:0,s:1,v:1,a:1};if(e.startsWith("#")){const t=i(e);if(t)return{...c(t.r,t.g,t.b),a:1}}const t=e.match(/^rgba?\((\d+),\s*(\d+),\s*(\d+)(?:,\s*([\d.]+))?\)$/);if(t){const e=parseInt(t[1],10),a=parseInt(t[2],10),n=parseInt(t[3],10),l=void 0!==t[4]?parseFloat(t[4]):1;return{...c(e,a,n),a:l}}return{h:0,s:1,v:1,a:1}}const m=({hue:t,saturation:a,value:l,onChange:r})=>{const s=e.useRef(null),[c,u]=e.useState(!1),i=e.useCallback(e=>{if(!s.current)return;const{width:t,height:a,left:n,top:l}=s.current.getBoundingClientRect(),c=o(e.clientX-n,0,t),u=o(e.clientY-l,0,a);r(c/t,1-u/a)},[r]),d=e.useCallback(()=>{u(!1)},[]);return e.useEffect(()=>{const e=e=>{c&&i(e)};return c&&(window.addEventListener("mousemove",e),window.addEventListener("mouseup",d)),()=>{window.removeEventListener("mousemove",e),window.removeEventListener("mouseup",d)}},[c,i,d]),/*#__PURE__*/n.default.createElement("div",{ref:s,className:"color-board",style:{backgroundColor:`hsl(${t}, 100%, 50%)`},onMouseDown:e=>{u(!0),i(e)}},/*#__PURE__*/n.default.createElement("div",{className:"color-board-white"}),/*#__PURE__*/n.default.createElement("div",{className:"color-board-black"}),/*#__PURE__*/n.default.createElement("div",{className:"color-board-handler",style:{left:100*a+"%",top:100*(1-l)+"%"}}))},f=({value:t,max:a,onChange:l,className:r,style:s,children:c})=>{const u=e.useRef(null),[i,d]=e.useState(!1),m=e.useCallback(e=>{if(!u.current)return;const{width:t,left:n}=u.current.getBoundingClientRect(),r=o(e.clientX-n,0,t);l(r/t*a)},[a,l]),f=e.useCallback(()=>{d(!1)},[]);return e.useEffect(()=>{const e=e=>{i&&m(e)};return i&&(window.addEventListener("mousemove",e),window.addEventListener("mouseup",f)),()=>{window.removeEventListener("mousemove",e),window.removeEventListener("mouseup",f)}},[i,m,f]),/*#__PURE__*/n.default.createElement("div",{ref:u,className:`color-slider ${r||""}`,style:s,onMouseDown:e=>{d(!0),m(e)}},/*#__PURE__*/n.default.createElement("div",{className:"color-slider-handler",style:{left:t/a*100+"%"}}),c)},p=({hue:e,onChange:t})=>/*#__PURE__*/n.default.createElement(f,{value:e,max:360,onChange:t,className:"hue-slider"}),h=({alpha:e,color:t,onChange:a})=>{const{r:l,g:r,b:o}=t;/*#__PURE__*/return n.default.createElement(f,{value:e,max:1,onChange:a,className:"alpha-slider-bg",style:{background:`linear-gradient(to right, rgba(${l},${r},${o},0) 0%, rgba(${l},${r},${o},1) 100%)`}})},g=({hue:t,saturation:a,value:l,alpha:r,onChange:o})=>{const[d,m]=e.useState("HEX"),[f,p]=e.useState({}),[h,g]=e.useState(!1),E=e.useRef(null);e.useEffect(()=>{const e=e=>{E.current&&!E.current.contains(e.target)&&g(!1)};return document.addEventListener("mousedown",e),()=>{document.removeEventListener("mousedown",e)}},[]);const v=e.useCallback(()=>s(t,a,l),[t,a,l]);e.useEffect(()=>{const e=v();if("HEX"===d)p({hex:u(e.r,e.g,e.b)});else if("RGB"===d)p({r:e.r,g:e.g,b:e.b});else if("HSL"===d){const t=function(e,t,a){e/=255,t/=255,a/=255;let n,l,r=Math.max(e,t,a),o=Math.min(e,t,a),s=(r+o)/2;if(r===o)n=l=0;else{let c=r-o;switch(l=s>.5?c/(2-r-o):c/(r+o),r){case e:n=(t-a)/c+(t<a?6:0);break;case t:n=(a-e)/c+2;break;case a:n=(e-t)/c+4;break;default:n=0}n/=6}return{h:360*n,s:l,l:s}}(e.r,e.g,e.b);p({h:Math.round(t.h),s:Math.round(100*t.s),l:Math.round(100*t.l)})}},[t,a,l,d,v]);const C=(e,t)=>{const a={...f,[e]:t};p(a);const n=parseInt(a.r,10),l=parseInt(a.g,10),s=parseInt(a.b,10);if(!isNaN(n)&&!isNaN(l)&&!isNaN(s)){const e=c(Math.min(255,Math.max(0,n)),Math.min(255,Math.max(0,l)),Math.min(255,Math.max(0,s)));o({...e,a:r})}},w=(e,t)=>{const a={...f,[e]:t};p(a);const n=parseInt(a.h,10),l=parseInt(a.s,10),s=parseInt(a.l,10);if(!isNaN(n)&&!isNaN(l)&&!isNaN(s)){const e=function(e,t,a){let n,l,r;if(0===t)n=l=r=a;else{const o=(e,t,a)=>(a<0&&(a+=1),a>1&&(a-=1),a<1/6?e+6*(t-e)*a:a<.5?t:a<2/3?e+(t-e)*(2/3-a)*6:e),s=a<.5?a*(1+t):a+t-a*t,c=2*a-s;n=o(c,s,(e/=360)+1/3),l=o(c,s,e),r=o(c,s,e-1/3)}return{r:Math.round(255*n),g:Math.round(255*l),b:Math.round(255*r)}}(Math.min(360,Math.max(0,n)),Math.min(100,Math.max(0,l))/100,Math.min(100,Math.max(0,s))/100),t=c(e.r,e.g,e.b);o({...t,a:r})}};/*#__PURE__*/return n.default.createElement("div",{className:"color-input-container"},/*#__PURE__*/n.default.createElement("div",{className:"mode-selector",ref:E,onClick:()=>g(!h)},/*#__PURE__*/n.default.createElement("span",null,d.charAt(0)+d.slice(1).toLowerCase()),/*#__PURE__*/n.default.createElement("span",{className:"arrow",style:{fontSize:"10px",marginLeft:"4px",transform:h?"rotate(180deg)":"rotate(0deg)",display:"inline-block",transition:"transform 0.2s",color:"#8c8c8c"}},/*#__PURE__*/n.default.createElement("svg",{viewBox:"0 0 1024 1024",width:"10",height:"10",fill:"currentColor"},/*#__PURE__*/n.default.createElement("path",{d:"M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3 0.1-12.7-6.4-12.7z"}))),h&&/*#__PURE__*/n.default.createElement("div",{className:"mode-dropdown"},/*#__PURE__*/n.default.createElement("div",{className:"mode-option",onClick:e=>{e.stopPropagation(),m("HEX"),g(!1)}},"Hex"),/*#__PURE__*/n.default.createElement("div",{className:"mode-option",onClick:e=>{e.stopPropagation(),m("RGB"),g(!1)}},"RGB"),/*#__PURE__*/n.default.createElement("div",{className:"mode-option",onClick:e=>{e.stopPropagation(),m("HSL"),g(!1)}},"HSL"))),/*#__PURE__*/n.default.createElement("div",{className:"color-input-fields"},"HEX"===d&&/*#__PURE__*/n.default.createElement("div",{className:"hex-input-wrapper"},/*#__PURE__*/n.default.createElement("span",{className:"hex-prefix"},"#"),/*#__PURE__*/n.default.createElement("input",{className:"color-input hex",value:f.hex?f.hex.replace("#",""):"",onChange:e=>{const t=e.target.value;if(p({...f,hex:t}),/^#?([0-9A-F]{3}|[0-9A-F]{6})$/i.test(t)){const e=i(t);if(e){const t=c(e.r,e.g,e.b);o({...t,a:r})}}}})),"RGB"===d&&/*#__PURE__*/n.default.createElement(n.default.Fragment,null,/*#__PURE__*/n.default.createElement("input",{className:"color-input",type:"number",placeholder:"R",value:void 0!==f.r?f.r:"",onChange:e=>C("r",e.target.value)}),/*#__PURE__*/n.default.createElement("input",{className:"color-input",type:"number",placeholder:"G",value:void 0!==f.g?f.g:"",onChange:e=>C("g",e.target.value)}),/*#__PURE__*/n.default.createElement("input",{className:"color-input",type:"number",placeholder:"B",value:void 0!==f.b?f.b:"",onChange:e=>C("b",e.target.value)})),"HSL"===d&&/*#__PURE__*/n.default.createElement(n.default.Fragment,null,/*#__PURE__*/n.default.createElement("input",{className:"color-input",type:"number",placeholder:"H",value:void 0!==f.h?f.h:"",onChange:e=>w("h",e.target.value)}),/*#__PURE__*/n.default.createElement("input",{className:"color-input",type:"number",placeholder:"S",value:void 0!==f.s?f.s:"",onChange:e=>w("s",e.target.value)}),/*#__PURE__*/n.default.createElement("input",{className:"color-input",type:"number",placeholder:"L",value:void 0!==f.l?f.l:"",onChange:e=>w("l",e.target.value)})),/*#__PURE__*/n.default.createElement("div",{className:"color-input alpha-display"},Math.round(100*r),"%")))},E=["#E0B5AE","#B2BBDE","#F2DDB3","#E0E5C5","#BBD0C3","#B5D1E3","#FFFFFF","#D25536","#EFA154","#F7DA7E","#5FA67F","#A2829D","#D390A2","#000000","#0099A4","#EABA00","#C9462C","#3171AC","#783780","#1E80EA","#2AAC3B","#B63455","#81532F","#AA9A5C","#828281","#055753","#8F262B","#F0D8D0"];module.exports=t=>{let{value:a,defaultValue:o,onChange:f,showLabel:v=!0,label:C="Color",showArrow:w=!0,showInput:b=!0,showColorBoard:k=!0,presets:N}=t;const[A,L]=e.useState(!1),[x,y]=e.useState(!1),[M,F]=e.useState([]),B=N||E,[R,S]=e.useState(()=>d(a||o||"#1677ff")),[D,I]=e.useState(()=>{const e=s(R.h,R.s,R.v);return u(e.r,e.g,e.b).toUpperCase()}),X=e.useRef(null),H=e.useRef(null),[P,O]=e.useState({});e.useEffect(()=>{if(void 0!==a){const e=d(a);S(e);const t=s(e.h,e.s,e.v);I(u(t.r,t.g,t.b).toUpperCase())}},[a]);const $=e=>{const t=r({},R,e);S(t);const a=s(t.h,t.s,t.v),n=u(a.r,a.g,a.b).toUpperCase();I(n),f&&f(n,r({},a,{a:t.a}))};e.useEffect(()=>{if(!A||!H.current||"undefined"==typeof window||"undefined"==typeof document)return;const e=H.current.getBoundingClientRect(),t=e.bottom+4+window.scrollY,a=e.left+window.scrollX;O({position:"absolute",top:t,left:a,zIndex:9999})},[A]),e.useEffect(()=>{const e=e=>{X.current&&!X.current.contains(e.target)&&L(!1)};if(A)document.addEventListener("mousedown",e);else{const e=s(R.h,R.s,R.v),t=u(e.r,e.g,e.b).toUpperCase();F(e=>e.includes(t)?e:[t,...e].slice(0,10))}return()=>{document.removeEventListener("mousedown",e)}},[A,R]);const U=s(R.h,R.s,R.v),z="rgba("+U.r+", "+U.g+", "+U.b+", "+R.a+")",T=x?B:B.slice(0,14),G=B.length>14,q=A?/*#__PURE__*/n.default.createElement("div",{className:"color-picker-panel",style:P},k&&/*#__PURE__*/n.default.createElement("div",{className:"color-picker-board-wrapper",style:{marginTop:"10px",paddingTop:"10px",borderTop:"1px solid #eee"}},/*#__PURE__*/n.default.createElement(m,{hue:R.h,saturation:R.s,value:R.v,onChange:(e,t)=>$({s:e,v:t})}),/*#__PURE__*/n.default.createElement(p,{hue:R.h,onChange:e=>$({h:e})}),/*#__PURE__*/n.default.createElement(h,{alpha:R.a,color:U,onChange:e=>$({a:e})}),/*#__PURE__*/n.default.createElement(g,{hue:R.h,saturation:R.s,value:R.v,alpha:R.a,onChange:e=>$(e)})),/*#__PURE__*/n.default.createElement("div",{className:"color-picker-presets"},/*#__PURE__*/n.default.createElement("div",{className:"palette-section-title",style:{marginTop:8}},/*#__PURE__*/n.default.createElement("span",null,"Recommended"),/*#__PURE__*/n.default.createElement("span",{className:"color-picker-icon-right",onClick:function(){try{if(!window.EyeDropper)return alert("当前浏览器不支持屏幕取色功能"),Promise.resolve();const e=function(e,t){try{var a=function(){const e=new window.EyeDropper;return Promise.resolve(e.open()).then(function(e){const{sRGBHex:t}=e,a=i(t);if(a){const e=c(a.r,a.g,a.b);$(r({},e,{a:1}))}})}()}catch(e){return t(e)}return a&&a.then?a.then(void 0,t):a}(0,function(e){console.log("EyeDropper failed or canceled:",e)});return Promise.resolve(e&&e.then?e.then(function(){}):void 0)}catch(e){return Promise.reject(e)}},title:"屏幕取色"},/*#__PURE__*/n.default.createElement("svg",{width:"16",height:"16",viewBox:"0 0 16 16",xmlns:"http://www.w3.org/2000/svg"},/*#__PURE__*/n.default.createElement("defs",null,/*#__PURE__*/n.default.createElement("rect",{id:"path-1",x:"0",y:"0",width:"16",height:"16"})),/*#__PURE__*/n.default.createElement("g",{stroke:"none",strokeWidth:"1",fill:"none",fillRule:"evenodd"},/*#__PURE__*/n.default.createElement("g",{transform:"translate(-920.000000, -594.000000)"},/*#__PURE__*/n.default.createElement("g",{transform:"translate(720.000000, 418.000000)"},/*#__PURE__*/n.default.createElement("g",{transform:"translate(200.000000, 176.000000)"},/*#__PURE__*/n.default.createElement("mask",{id:"mask-2",fill:"white"},/*#__PURE__*/n.default.createElement("use",{xlinkHref:"#path-1"})),/*#__PURE__*/n.default.createElement("g",null),/*#__PURE__*/n.default.createElement("g",{mask:"url(#mask-2)",fill:"#000000",fillOpacity:"0.85",fillRule:"nonzero"},/*#__PURE__*/n.default.createElement("g",{transform:"translate(8.106532, 8.106532) rotate(-315.000000) translate(-8.106532, -8.106532) translate(-0.266667, -0.266667)"},/*#__PURE__*/n.default.createElement("path",{d:"M5.67238576,2.96585378 L6.99478644,4.28811977 L7.03978941,4.24867364 C7.66833128,3.72977631 8.60030981,3.76436946 9.18839345,4.3524531 L9.94264069,5.10670034 C10.1509203,5.31497996 10.1509203,5.65266795 9.94264069,5.86094757 L9.18778644,6.61411977 L13.7138769,11.1406782 C14.4428555,11.8696569 14.4428555,13.0515648 13.7138769,13.7805435 C12.9848982,14.5095222 11.8029902,14.5095222 11.0740115,13.7805435 L6.54778644,9.25411977 L5.7942809,10.0093074 C5.58600128,10.217587 5.24831329,10.217587 5.04003367,10.0093074 L4.28578644,9.25506012 C3.66094757,8.63022125 3.66094757,7.61715729 4.28578644,6.99231842 L4.35178644,6.92511977 L3.03252045,5.6057191 C2.30354177,4.87674042 2.30354177,3.69483246 3.03252045,2.96585378 C3.76149912,2.2368751 4.94340708,2.2368751 5.67238576,2.96585378 Z M8.43414622,7.36944204 L7.86778644,7.93411977 L7.30277537,8.50081289 L11.8282588,13.0262963 C12.1295204,13.3275579 12.6112769,13.3383172 12.925431,13.0585743 L12.9596296,13.0262963 C13.2720491,12.7138769 13.2720491,12.2073449 12.9596296,11.8949254 L8.43414622,7.36944204 Z M7.70907857,5.07958956 L7.67989899,5.10670034 L5.04003367,7.74656565 C4.83175405,7.95484528 4.83175405,8.29253326 5.04003367,8.50081289 L5.41715729,8.8779365 L8.81126984,5.48382395 L8.43414622,5.10670034 C8.23533385,4.90788797 7.91861014,4.89885105 7.70907857,5.07958956 Z M3.82096628,3.68782298 L3.78676768,3.72010101 C3.47434825,4.03252045 3.47434825,4.53905243 3.78676768,4.85147186 L5.10670034,6.17140452 L6.23807119,5.04003367 L4.91813853,3.72010101 C4.61687693,3.41883942 4.13512038,3.40808007 3.82096628,3.68782298 Z",transform:"translate(8.373199, 8.373199) rotate(-315.000000) translate(-8.373199, -8.373199)"})))))))))),/*#__PURE__*/n.default.createElement("div",{className:"presets-grid modern"},B.map((e,t)=>/*#__PURE__*/n.default.createElement("div",{key:t,className:"preset-item preset-item-inner",style:{backgroundColor:e},onClick:()=>{const t=i(e);if(t){const e=c(t.r,t.g,t.b);$(r({},e,{a:1}))}},title:e}))),M.length>0&&/*#__PURE__*/n.default.createElement(n.default.Fragment,null,/*#__PURE__*/n.default.createElement("div",{className:"palette-section-title"},"Recent"),/*#__PURE__*/n.default.createElement("div",{className:"presets-grid recent"},M.map((e,t)=>/*#__PURE__*/n.default.createElement("div",{key:t,className:"preset-item",style:{backgroundColor:e},onClick:()=>{const t=i(e);if(t){const e=c(t.r,t.g,t.b);$(r({},e,{a:1}))}},title:e})))))):null;/*#__PURE__*/return n.default.createElement("div",{className:"color-picker-container",ref:X},/*#__PURE__*/n.default.createElement("div",{className:"color-picker-main-row"},/*#__PURE__*/n.default.createElement("div",{className:"color-picker-tooltip-trigger"},v&&/*#__PURE__*/n.default.createElement("span",{className:"color-picker-label"},C),/*#__PURE__*/n.default.createElement("div",{className:"color-picker-trigger "+(A?"is-open":""),onClick:()=>L(!A),ref:H},/*#__PURE__*/n.default.createElement("div",{className:"color-block",style:{backgroundColor:z}}),w&&/*#__PURE__*/n.default.createElement("span",{className:"color-picker-arrow "+(A?"open":"")},/*#__PURE__*/n.default.createElement("svg",{width:"16",height:"16",viewBox:"0 0 16 16",xmlns:"http://www.w3.org/2000/svg"},/*#__PURE__*/n.default.createElement("g",{stroke:"none",strokeWidth:"1",fill:"none",fillRule:"evenodd"},/*#__PURE__*/n.default.createElement("g",{transform:"translate(-1348.000000, -88.000000)",fillRule:"nonzero"},/*#__PURE__*/n.default.createElement("g",{transform:"translate(0.000000, 60.000000)"},/*#__PURE__*/n.default.createElement("g",{transform:"translate(584.000000, 20.000000)"},/*#__PURE__*/n.default.createElement("g",{transform:"translate(728.000000, 4.000000)"},/*#__PURE__*/n.default.createElement("g",{transform:"translate(44.000000, 12.000000) rotate(-360.000000) translate(-44.000000, -12.000000) translate(36.000000, 4.000000)"},/*#__PURE__*/n.default.createElement("rect",{fill:"#000000",opacity:"0",x:"0",y:"0",width:"16",height:"16"}),/*#__PURE__*/n.default.createElement("path",{d:"M13.0750341,5.34788541 C12.9440655,5.21691678 12.7257845,5.21691678 12.5948158,5.34788541 L8.01091405,9.93178717 L3.40518417,5.34788541 C3.27421555,5.21691678 3.05593452,5.21691678 2.92496589,5.34788541 C2.79399727,5.47885403 2.79399727,5.69713506 2.92496589,5.82810369 L7.77080491,10.6521146 C7.90177353,10.7830832 8.12005456,10.7830832 8.25102319,10.6521146 L13.0750341,5.82810369 C13.2060027,5.69713506 13.2060027,5.47885403 13.0750341,5.34788541 Z",stroke:"#FFFFFF"}))))))))),/*#__PURE__*/n.default.createElement("span",{className:"tooltip-text"},"Color Picker"))),b&&/*#__PURE__*/n.default.createElement("div",{className:"color-picker-input-wrapper"},/*#__PURE__*/n.default.createElement("input",{type:"text",value:D,onChange:e=>{const t=e.target.value;if(I(t),/^#?([0-9A-F]{3}|[0-9A-F]{6})$/i.test(t)){const e=i(t);if(e){const t=c(e.r,e.g,e.b);$(r({},t,{a:R.a}))}}},placeholder:"Please input color"}),D&&/*#__PURE__*/n.default.createElement("span",{className:"input-clear-icon",onClick:()=>I("")},/*#__PURE__*/n.default.createElement("img",{src:"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAA8klEQVQ4T51SwVHDQAzcdQOETugAqISkg/Cw9CRf2Q+gAkwlJB1QimnAYnRz57m55AG5l2+9K632RFw44zg+ALiPX+5+FJFTS2MNmNme5AuATUOcARxE5L3gq9DMJpJPlxxU2CQiu7gnYe70mq19tgXcfcXc/VlV34pwJnkTBFXdDsOwBfCRO+1EZKoczSJyywjC3b8qO4mYxai+SyGQfKSZHXIg9XhJHEDTPXHC7vXCq63mVP8cjrv/qOrm7DkAxGyRan1qLM3/rwUoz7UuQCkdixCrFW9atwt7JPcl6TNhIUdgy7Lcxb3ruu++74/tKv4CNXed5xhXezYAAAAASUVORK5CYII=",alt:"",width:"12",height:"12"})))),"undefined"!=typeof document&&l.default.createPortal(q,document.body),/*#__PURE__*/n.default.createElement("div",null,/*#__PURE__*/n.default.createElement("div",{className:"presets-grid modern"},T.map((e,t)=>/*#__PURE__*/n.default.createElement("div",{key:t,className:"preset-item",style:{backgroundColor:e},onClick:()=>{const t=i(e);if(t){const e=c(t.r,t.g,t.b);$(r({},e,{a:1}))}},title:e}))),G&&/*#__PURE__*/n.default.createElement("div",{className:"presets-collapse",onClick:()=>y(!x)},x?"Less":"More",/*#__PURE__*/n.default.createElement("span",{className:"collapse-arrow "+(x?"expanded":"")},"▼"))))};
1
+ var e=require("react"),t=require("react-dom");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=/*#__PURE__*/a(e),l=/*#__PURE__*/a(t);function r(){return r=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var a=arguments[t];for(var n in a)({}).hasOwnProperty.call(a,n)&&(e[n]=a[n])}return e},r.apply(null,arguments)}function o(e,t,a){return Math.min(Math.max(e,t),a)}function s(e,t,a){let n,l,r;e=(e%360+360)%360;let o=Math.floor(e/60),s=e/60-o,c=a*(1-t),u=a*(1-s*t),i=a*(1-(1-s)*t);switch(o%6){case 0:n=a,l=i,r=c;break;case 1:n=u,l=a,r=c;break;case 2:n=c,l=a,r=i;break;case 3:n=c,l=u,r=a;break;case 4:n=i,l=c,r=a;break;case 5:n=a,l=c,r=u;break;default:n=0,l=0,r=0}return{r:Math.round(255*n),g:Math.round(255*l),b:Math.round(255*r)}}function c(e,t,a){e/=255,t/=255,a/=255;let n,l,r=Math.max(e,t,a),o=Math.min(e,t,a),s=r,c=r-o;if(l=0===r?0:c/r,r===o)n=0;else{switch(r){case e:n=(t-a)/c+(t<a?6:0);break;case t:n=(a-e)/c+2;break;case a:n=(e-t)/c+4;break;default:n=0}n/=6}return{h:360*n,s:l,v:s}}function u(e,t,a){const n=e=>{const t=Math.round(e).toString(16);return 1===t.length?"0"+t:t};return"#"+n(e)+n(t)+n(a)}function i(e){e=e.replace(/^#?([a-f\d])([a-f\d])([a-f\d])$/i,function(e,t,a,n){return t+t+a+a+n+n});const t=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(e);return t?{r:parseInt(t[1],16),g:parseInt(t[2],16),b:parseInt(t[3],16)}:null}function d(e){if(!e)return{h:0,s:1,v:1,a:1};if(e.startsWith("#")){const t=i(e);if(t)return{...c(t.r,t.g,t.b),a:1}}const t=e.match(/^rgba?\((\d+),\s*(\d+),\s*(\d+)(?:,\s*([\d.]+))?\)$/);if(t){const e=parseInt(t[1],10),a=parseInt(t[2],10),n=parseInt(t[3],10),l=void 0!==t[4]?parseFloat(t[4]):1;return{...c(e,a,n),a:l}}return{h:0,s:1,v:1,a:1}}const m=({hue:t,saturation:a,value:l,onChange:r,onComplete:s})=>{const c=e.useRef(null),[u,i]=e.useState(!1),d=e.useCallback(e=>{if(!c.current)return;const{width:t,height:a,left:n,top:l}=c.current.getBoundingClientRect(),s=o(e.clientX-n,0,t),u=o(e.clientY-l,0,a);r(s/t,1-u/a)},[r]),m=e.useCallback(()=>{i(!1),s&&s()},[s]);return e.useEffect(()=>{const e=e=>{u&&d(e)};return u&&(window.addEventListener("mousemove",e),window.addEventListener("mouseup",m)),()=>{window.removeEventListener("mousemove",e),window.removeEventListener("mouseup",m)}},[u,d,m]),/*#__PURE__*/n.default.createElement("div",{ref:c,className:"color-board",style:{backgroundColor:`hsl(${t}, 100%, 50%)`},onMouseDown:e=>{i(!0),d(e)}},/*#__PURE__*/n.default.createElement("div",{className:"color-board-white"}),/*#__PURE__*/n.default.createElement("div",{className:"color-board-black"}),/*#__PURE__*/n.default.createElement("div",{className:"color-board-handler",style:{left:100*a+"%",top:100*(1-l)+"%"}}))},f=t=>{let{value:a,max:l,onChange:r,className:s,style:c,children:u}=t;const i=e.useRef(null),[d,m]=e.useState(!1),f=e.useCallback(e=>{if(!i.current)return;const{width:t,left:a}=i.current.getBoundingClientRect(),n=o(e.clientX-a,0,t);r(n/t*l)},[l,r]),p=e.useCallback(()=>{m(!1)},[]);return e.useEffect(()=>{const e=e=>{d&&f(e)};return d&&(window.addEventListener("mousemove",e),window.addEventListener("mouseup",p)),()=>{window.removeEventListener("mousemove",e),window.removeEventListener("mouseup",p)}},[d,f,p]),/*#__PURE__*/n.default.createElement("div",{ref:i,className:"color-slider "+(s||""),style:c,onMouseDown:e=>{m(!0),f(e)}},/*#__PURE__*/n.default.createElement("div",{className:"color-slider-handler",style:{left:a/l*100+"%"}}),u)},p=e=>{let{hue:t,onChange:a}=e;/*#__PURE__*/return n.default.createElement(f,{value:t,max:360,onChange:a,className:"hue-slider"})},h=({hue:t,saturation:a,value:l,alpha:r,onChange:o})=>{const[d,m]=e.useState("HEX"),[f,p]=e.useState({}),[h,g]=e.useState(!1),E=e.useRef(null);e.useEffect(()=>{const e=e=>{E.current&&!E.current.contains(e.target)&&g(!1)};return document.addEventListener("mousedown",e),()=>{document.removeEventListener("mousedown",e)}},[]);const v=e.useCallback(()=>s(t,a,l),[t,a,l]);e.useEffect(()=>{const e=v();if("HEX"===d)p({hex:u(e.r,e.g,e.b)});else if("RGB"===d)p({r:e.r,g:e.g,b:e.b});else if("HSL"===d){const t=function(e,t,a){e/=255,t/=255,a/=255;let n,l,r=Math.max(e,t,a),o=Math.min(e,t,a),s=(r+o)/2;if(r===o)n=l=0;else{let c=r-o;switch(l=s>.5?c/(2-r-o):c/(r+o),r){case e:n=(t-a)/c+(t<a?6:0);break;case t:n=(a-e)/c+2;break;case a:n=(e-t)/c+4;break;default:n=0}n/=6}return{h:360*n,s:l,l:s}}(e.r,e.g,e.b);p({h:Math.round(t.h),s:Math.round(100*t.s),l:Math.round(100*t.l)})}},[t,a,l,d,v]);const C=(e,t)=>{const a={...f,[e]:t};p(a);const n=parseInt(a.r,10),l=parseInt(a.g,10),s=parseInt(a.b,10);if(!isNaN(n)&&!isNaN(l)&&!isNaN(s)){const e=c(Math.min(255,Math.max(0,n)),Math.min(255,Math.max(0,l)),Math.min(255,Math.max(0,s)));o({...e,a:r})}},w=(e,t)=>{const a={...f,[e]:t};p(a);const n=parseInt(a.h,10),l=parseInt(a.s,10),s=parseInt(a.l,10);if(!isNaN(n)&&!isNaN(l)&&!isNaN(s)){const e=function(e,t,a){let n,l,r;if(0===t)n=l=r=a;else{const o=(e,t,a)=>(a<0&&(a+=1),a>1&&(a-=1),a<1/6?e+6*(t-e)*a:a<.5?t:a<2/3?e+(t-e)*(2/3-a)*6:e),s=a<.5?a*(1+t):a+t-a*t,c=2*a-s;n=o(c,s,(e/=360)+1/3),l=o(c,s,e),r=o(c,s,e-1/3)}return{r:Math.round(255*n),g:Math.round(255*l),b:Math.round(255*r)}}(Math.min(360,Math.max(0,n)),Math.min(100,Math.max(0,l))/100,Math.min(100,Math.max(0,s))/100),t=c(e.r,e.g,e.b);o({...t,a:r})}};/*#__PURE__*/return n.default.createElement("div",{className:"color-input-container"},/*#__PURE__*/n.default.createElement("div",{className:"mode-selector",ref:E,onClick:()=>g(!h)},/*#__PURE__*/n.default.createElement("span",null,d.charAt(0)+d.slice(1).toLowerCase()),/*#__PURE__*/n.default.createElement("span",{className:"arrow",style:{fontSize:"10px",marginLeft:"4px",transform:h?"rotate(180deg)":"rotate(0deg)",display:"inline-block",transition:"transform 0.2s",color:"#8c8c8c"}},/*#__PURE__*/n.default.createElement("svg",{viewBox:"0 0 1024 1024",width:"10",height:"10",fill:"currentColor"},/*#__PURE__*/n.default.createElement("path",{d:"M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3 0.1-12.7-6.4-12.7z"}))),h&&/*#__PURE__*/n.default.createElement("div",{className:"mode-dropdown"},/*#__PURE__*/n.default.createElement("div",{className:"mode-option",onClick:e=>{e.stopPropagation(),m("HEX"),g(!1)}},"Hex"),/*#__PURE__*/n.default.createElement("div",{className:"mode-option",onClick:e=>{e.stopPropagation(),m("RGB"),g(!1)}},"RGB"),/*#__PURE__*/n.default.createElement("div",{className:"mode-option",onClick:e=>{e.stopPropagation(),m("HSL"),g(!1)}},"HSL"))),/*#__PURE__*/n.default.createElement("div",{className:"color-input-fields"},"HEX"===d&&/*#__PURE__*/n.default.createElement("div",{className:"hex-input-wrapper"},/*#__PURE__*/n.default.createElement("span",{className:"hex-prefix"},"#"),/*#__PURE__*/n.default.createElement("input",{className:"color-input hex",value:f.hex?f.hex.replace("#",""):"",onChange:e=>{const t=e.target.value;if(p({...f,hex:t}),/^#?([0-9A-F]{3}|[0-9A-F]{6})$/i.test(t)){const e=i(t);if(e){const t=c(e.r,e.g,e.b);o({...t,a:r})}}}})),"RGB"===d&&/*#__PURE__*/n.default.createElement(n.default.Fragment,null,/*#__PURE__*/n.default.createElement("input",{className:"color-input",type:"number",placeholder:"R",value:void 0!==f.r?f.r:"",onChange:e=>C("r",e.target.value)}),/*#__PURE__*/n.default.createElement("input",{className:"color-input",type:"number",placeholder:"G",value:void 0!==f.g?f.g:"",onChange:e=>C("g",e.target.value)}),/*#__PURE__*/n.default.createElement("input",{className:"color-input",type:"number",placeholder:"B",value:void 0!==f.b?f.b:"",onChange:e=>C("b",e.target.value)})),"HSL"===d&&/*#__PURE__*/n.default.createElement(n.default.Fragment,null,/*#__PURE__*/n.default.createElement("input",{className:"color-input",type:"number",placeholder:"H",value:void 0!==f.h?f.h:"",onChange:e=>w("h",e.target.value)}),/*#__PURE__*/n.default.createElement("input",{className:"color-input",type:"number",placeholder:"S",value:void 0!==f.s?f.s:"",onChange:e=>w("s",e.target.value)}),/*#__PURE__*/n.default.createElement("input",{className:"color-input",type:"number",placeholder:"L",value:void 0!==f.l?f.l:"",onChange:e=>w("l",e.target.value)})),/*#__PURE__*/n.default.createElement("div",{className:"color-input alpha-display"},Math.round(100*r),"%")))},g=["#E0B5AE","#B2BBDE","#F2DDB3","#E0E5C5","#BBD0C3","#B5D1E3","#FFFFFF","#D25536","#EFA154","#F7DA7E","#5FA67F","#A2829D","#D390A2","#000000","#0099A4","#EABA00","#C9462C","#3171AC","#783780","#1E80EA","#2AAC3B","#B63455","#81532F","#AA9A5C","#828281","#055753","#8F262B","#F0D8D0"];module.exports=t=>{let{value:a,defaultValue:o,onChange:f,showLabel:E=!0,label:v="Color",showArrow:C=!0,showInput:w=!0,showColorBoard:b=!0,presets:k,tooltipText:N="Color Picker",screenPickerTooltip:A="屏幕取色",recommendedTitle:L="Recommended",recentTitle:x="Recent",moreText:y="More",lessText:M="Less"}=t;const[F,R]=e.useState(!1),[B,S]=e.useState(!1),[D,I]=e.useState([]),H=k||g,[P,X]=e.useState(()=>d(a||o||"#1677ff")),[T,O]=e.useState(()=>{const e=s(P.h,P.s,P.v);return u(e.r,e.g,e.b).toUpperCase()}),U=e.useRef(null),z=e.useRef(null),G=e.useRef(null),[q,Q]=e.useState({});e.useEffect(()=>{if(void 0!==a){const e=d(a);X(e);const t=s(e.h,e.s,e.v);O(u(t.r,t.g,t.b).toUpperCase())}},[a]);const Y=e=>{const t=r({},P,e);X(t);const a=s(t.h,t.s,t.v),n=u(a.r,a.g,a.b).toUpperCase();O(n),f&&f(n,r({},a,{a:t.a}))};e.useLayoutEffect(()=>{if(!F||!z.current||!G.current||"undefined"==typeof window)return;const e=z.current.getBoundingClientRect(),t=G.current.getBoundingClientRect(),a=window.innerHeight,n=window.innerWidth;let l=e.bottom+window.scrollY+4,r=e.left+window.scrollX;e.bottom+t.height+4>a&&e.top>t.height+4&&(l=e.top+window.scrollY-t.height-4),e.left+t.width>n&&(r=n-t.width-10),r<0&&(r=0),Q({position:"absolute",top:l,left:r,zIndex:9999})},[F,B,D.length]),e.useEffect(()=>{const e=e=>{const t=U.current,a=G.current,n=t&&t.contains(e.target),l=a&&a.contains(e.target);n||l||R(!1)};if(F)document.addEventListener("mousedown",e);else{const e=s(P.h,P.s,P.v),t=u(e.r,e.g,e.b).toUpperCase();I(e=>e.includes(t)?e:[t,...e].slice(0,10))}return()=>{document.removeEventListener("mousedown",e)}},[F,P]);const J=s(P.h,P.s,P.v),V="rgba("+J.r+", "+J.g+", "+J.b+", "+P.a+")",Z=B?H:H.slice(0,14),j=H.length>14,K=F?/*#__PURE__*/n.default.createElement("div",{className:"color-picker-panel",style:q,ref:G},b&&/*#__PURE__*/n.default.createElement("div",{className:"color-picker-board-wrapper",style:{marginTop:"10px",borderTop:"1px solid #eee"}},/*#__PURE__*/n.default.createElement(m,{hue:P.h,saturation:P.s,value:P.v,onChange:(e,t)=>Y({s:e,v:t}),onComplete:()=>R(!1)}),/*#__PURE__*/n.default.createElement(p,{hue:P.h,onChange:e=>Y({h:e})}),/*#__PURE__*/n.default.createElement(h,{hue:P.h,saturation:P.s,value:P.v,alpha:P.a,onChange:e=>Y(e)})),/*#__PURE__*/n.default.createElement("div",{className:"color-picker-presets"},/*#__PURE__*/n.default.createElement("div",{className:"palette-section-title",style:{marginTop:8}},/*#__PURE__*/n.default.createElement("span",null,L),/*#__PURE__*/n.default.createElement("span",{className:"color-picker-icon-right",onClick:function(){try{if(!window.EyeDropper)return alert("当前浏览器不支持屏幕取色功能"),Promise.resolve();const e=function(e,t){try{var a=function(){const e=new window.EyeDropper;return Promise.resolve(e.open()).then(function(e){const{sRGBHex:t}=e,a=i(t);if(a){const e=c(a.r,a.g,a.b);Y(r({},e,{a:1}))}})}()}catch(e){return t(e)}return a&&a.then?a.then(void 0,t):a}(0,function(e){console.log("EyeDropper failed or canceled:",e)});return Promise.resolve(e&&e.then?e.then(function(){}):void 0)}catch(e){return Promise.reject(e)}},title:A},/*#__PURE__*/n.default.createElement("svg",{width:"16",height:"16",viewBox:"0 0 16 16",xmlns:"http://www.w3.org/2000/svg"},/*#__PURE__*/n.default.createElement("defs",null,/*#__PURE__*/n.default.createElement("rect",{id:"path-1",x:"0",y:"0",width:"16",height:"16"})),/*#__PURE__*/n.default.createElement("g",{stroke:"none",strokeWidth:"1",fill:"none",fillRule:"evenodd"},/*#__PURE__*/n.default.createElement("g",{transform:"translate(-920.000000, -594.000000)"},/*#__PURE__*/n.default.createElement("g",{transform:"translate(720.000000, 418.000000)"},/*#__PURE__*/n.default.createElement("g",{transform:"translate(200.000000, 176.000000)"},/*#__PURE__*/n.default.createElement("mask",{id:"mask-2",fill:"white"},/*#__PURE__*/n.default.createElement("use",{xlinkHref:"#path-1"})),/*#__PURE__*/n.default.createElement("g",null),/*#__PURE__*/n.default.createElement("g",{mask:"url(#mask-2)",fill:"#000000",fillOpacity:"0.85",fillRule:"nonzero"},/*#__PURE__*/n.default.createElement("g",{transform:"translate(8.106532, 8.106532) rotate(-315.000000) translate(-8.106532, -8.106532) translate(-0.266667, -0.266667)"},/*#__PURE__*/n.default.createElement("path",{d:"M5.67238576,2.96585378 L6.99478644,4.28811977 L7.03978941,4.24867364 C7.66833128,3.72977631 8.60030981,3.76436946 9.18839345,4.3524531 L9.94264069,5.10670034 C10.1509203,5.31497996 10.1509203,5.65266795 9.94264069,5.86094757 L9.18778644,6.61411977 L13.7138769,11.1406782 C14.4428555,11.8696569 14.4428555,13.0515648 13.7138769,13.7805435 C12.9848982,14.5095222 11.8029902,14.5095222 11.0740115,13.7805435 L6.54778644,9.25411977 L5.7942809,10.0093074 C5.58600128,10.217587 5.24831329,10.217587 5.04003367,10.0093074 L4.28578644,9.25506012 C3.66094757,8.63022125 3.66094757,7.61715729 4.28578644,6.99231842 L4.35178644,6.92511977 L3.03252045,5.6057191 C2.30354177,4.87674042 2.30354177,3.69483246 3.03252045,2.96585378 C3.76149912,2.2368751 4.94340708,2.2368751 5.67238576,2.96585378 Z M8.43414622,7.36944204 L7.86778644,7.93411977 L7.30277537,8.50081289 L11.8282588,13.0262963 C12.1295204,13.3275579 12.6112769,13.3383172 12.925431,13.0585743 L12.9596296,13.0262963 C13.2720491,12.7138769 13.2720491,12.2073449 12.9596296,11.8949254 L8.43414622,7.36944204 Z M7.70907857,5.07958956 L7.67989899,5.10670034 L5.04003367,7.74656565 C4.83175405,7.95484528 4.83175405,8.29253326 5.04003367,8.50081289 L5.41715729,8.8779365 L8.81126984,5.48382395 L8.43414622,5.10670034 C8.23533385,4.90788797 7.91861014,4.89885105 7.70907857,5.07958956 Z M3.82096628,3.68782298 L3.78676768,3.72010101 C3.47434825,4.03252045 3.47434825,4.53905243 3.78676768,4.85147186 L5.10670034,6.17140452 L6.23807119,5.04003367 L4.91813853,3.72010101 C4.61687693,3.41883942 4.13512038,3.40808007 3.82096628,3.68782298 Z",transform:"translate(8.373199, 8.373199) rotate(-315.000000) translate(-8.373199, -8.373199)"})))))))))),/*#__PURE__*/n.default.createElement("div",{className:"presets-grid modern"},H.map((e,t)=>/*#__PURE__*/n.default.createElement("div",{key:t,className:"preset-item preset-item-inner",style:{backgroundColor:e},onClick:()=>{const t=i(e);if(t){const e=c(t.r,t.g,t.b);Y(r({},e,{a:1})),R(!1)}},title:e}))),D.length>0&&/*#__PURE__*/n.default.createElement(n.default.Fragment,null,/*#__PURE__*/n.default.createElement("div",{className:"palette-section-title"},x),/*#__PURE__*/n.default.createElement("div",{className:"presets-grid recent"},D.map((e,t)=>/*#__PURE__*/n.default.createElement("div",{key:t,className:"preset-item",style:{backgroundColor:e},onClick:()=>{const t=i(e);if(t){const e=c(t.r,t.g,t.b);Y(r({},e,{a:1})),R(!1)}},title:e})))))):null;/*#__PURE__*/return n.default.createElement("div",{className:"color-picker-container",ref:U},/*#__PURE__*/n.default.createElement("div",{className:"color-picker-main-row"},/*#__PURE__*/n.default.createElement("div",{className:"color-picker-tooltip-trigger"},E&&/*#__PURE__*/n.default.createElement("span",{className:"color-picker-label"},v),/*#__PURE__*/n.default.createElement("div",{className:"color-picker-trigger "+(F?"is-open":""),onClick:()=>R(!F),ref:z},/*#__PURE__*/n.default.createElement("div",{className:"color-block",style:{backgroundColor:V}}),C&&/*#__PURE__*/n.default.createElement("span",{className:"color-picker-arrow "+(F?"open":"")},/*#__PURE__*/n.default.createElement("svg",{width:"16",height:"16",viewBox:"0 0 16 16",xmlns:"http://www.w3.org/2000/svg"},/*#__PURE__*/n.default.createElement("g",{stroke:"none",strokeWidth:"1",fill:"none",fillRule:"evenodd"},/*#__PURE__*/n.default.createElement("g",{transform:"translate(-1348.000000, -88.000000)",fillRule:"nonzero"},/*#__PURE__*/n.default.createElement("g",{transform:"translate(0.000000, 60.000000)"},/*#__PURE__*/n.default.createElement("g",{transform:"translate(584.000000, 20.000000)"},/*#__PURE__*/n.default.createElement("g",{transform:"translate(728.000000, 4.000000)"},/*#__PURE__*/n.default.createElement("g",{transform:"translate(44.000000, 12.000000) rotate(-360.000000) translate(-44.000000, -12.000000) translate(36.000000, 4.000000)"},/*#__PURE__*/n.default.createElement("rect",{fill:"#000000",opacity:"0",x:"0",y:"0",width:"16",height:"16"}),/*#__PURE__*/n.default.createElement("path",{d:"M13.0750341,5.34788541 C12.9440655,5.21691678 12.7257845,5.21691678 12.5948158,5.34788541 L8.01091405,9.93178717 L3.40518417,5.34788541 C3.27421555,5.21691678 3.05593452,5.21691678 2.92496589,5.34788541 C2.79399727,5.47885403 2.79399727,5.69713506 2.92496589,5.82810369 L7.77080491,10.6521146 C7.90177353,10.7830832 8.12005456,10.7830832 8.25102319,10.6521146 L13.0750341,5.82810369 C13.2060027,5.69713506 13.2060027,5.47885403 13.0750341,5.34788541 Z",stroke:"#FFFFFF"}))))))))),/*#__PURE__*/n.default.createElement("span",{className:"tooltip-text"},N))),w&&/*#__PURE__*/n.default.createElement("div",{className:"color-picker-input-wrapper"},/*#__PURE__*/n.default.createElement("input",{type:"text",value:T,onChange:e=>{const t=e.target.value;if(O(t),/^#?([0-9A-F]{3}|[0-9A-F]{6})$/i.test(t)){const e=i(t);if(e){const t=c(e.r,e.g,e.b);Y(r({},t,{a:P.a}))}}},placeholder:"Please input color"}),T&&/*#__PURE__*/n.default.createElement("span",{className:"input-clear-icon",onClick:()=>O("")},/*#__PURE__*/n.default.createElement("img",{src:"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAA8klEQVQ4T51SwVHDQAzcdQOETugAqISkg/Cw9CRf2Q+gAkwlJB1QimnAYnRz57m55AG5l2+9K632RFw44zg+ALiPX+5+FJFTS2MNmNme5AuATUOcARxE5L3gq9DMJpJPlxxU2CQiu7gnYe70mq19tgXcfcXc/VlV34pwJnkTBFXdDsOwBfCRO+1EZKoczSJyywjC3b8qO4mYxai+SyGQfKSZHXIg9XhJHEDTPXHC7vXCq63mVP8cjrv/qOrm7DkAxGyRan1qLM3/rwUoz7UuQCkdixCrFW9atwt7JPcl6TNhIUdgy7Lcxb3ruu++74/tKv4CNXed5xhXezYAAAAASUVORK5CYII=",alt:"",width:"12",height:"12"})))),"undefined"!=typeof document&&l.default.createPortal(K,document.body),/*#__PURE__*/n.default.createElement("div",null,/*#__PURE__*/n.default.createElement("div",{className:"presets-grid modern"},Z.map((e,t)=>/*#__PURE__*/n.default.createElement("div",{key:t,className:"preset-item",style:{backgroundColor:e},onClick:()=>{const t=i(e);if(t){const e=c(t.r,t.g,t.b);Y(r({},e,{a:1}))}},title:e}))),j&&/*#__PURE__*/n.default.createElement("div",{className:"presets-collapse",onClick:()=>S(!B)},B?M:y,/*#__PURE__*/n.default.createElement("span",{className:"collapse-arrow "+(B?"expanded":"")},"▼"))))};
2
2
  //# sourceMappingURL=index.js.map
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../src/lib/utils/color.js","../src/lib/ColorBoard.js","../src/lib/Sliders.js","../src/lib/ColorInput.js","../src/lib/index.js"],"sourcesContent":["export function clamp(value, min, max) {\n return Math.min(Math.max(value, min), max);\n}\n\nexport function hsvToRgb(h, s, v) {\n h = ((h % 360) + 360) % 360;\n let r, g, b;\n let i = Math.floor(h / 60);\n let f = h / 60 - i;\n let p = v * (1 - s);\n let q = v * (1 - f * s);\n let t = v * (1 - (1 - f) * s);\n\n switch (i % 6) {\n case 0:\n r = v;\n g = t;\n b = p;\n break;\n case 1:\n r = q;\n g = v;\n b = p;\n break;\n case 2:\n r = p;\n g = v;\n b = t;\n break;\n case 3:\n r = p;\n g = q;\n b = v;\n break;\n case 4:\n r = t;\n g = p;\n b = v;\n break;\n case 5:\n r = v;\n g = p;\n b = q;\n break;\n default:\n r = 0;\n g = 0;\n b = 0;\n }\n\n return {\n r: Math.round(r * 255),\n g: Math.round(g * 255),\n b: Math.round(b * 255),\n };\n}\n\nexport function rgbToHsv(r, g, b) {\n r /= 255;\n g /= 255;\n b /= 255;\n\n let max = Math.max(r, g, b);\n let min = Math.min(r, g, b);\n let h,\n s,\n v = max;\n\n let d = max - min;\n s = max === 0 ? 0 : d / max;\n\n if (max === min) {\n h = 0;\n } else {\n switch (max) {\n case r:\n h = (g - b) / d + (g < b ? 6 : 0);\n break;\n case g:\n h = (b - r) / d + 2;\n break;\n case b:\n h = (r - g) / d + 4;\n break;\n default:\n h = 0;\n }\n h /= 6;\n }\n\n return {\n h: h * 360,\n s: s,\n v: v,\n };\n}\n\nexport function rgbToHex(r, g, b) {\n const toHex = (c) => {\n const hex = Math.round(c).toString(16);\n return hex.length === 1 ? \"0\" + hex : hex;\n };\n return \"#\" + toHex(r) + toHex(g) + toHex(b);\n}\n\nexport function hexToRgb(hex) {\n const shorthandRegex = /^#?([a-f\\d])([a-f\\d])([a-f\\d])$/i;\n hex = hex.replace(shorthandRegex, function(m, r, g, b) {\n return r + r + g + g + b + b;\n });\n\n const result = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(hex);\n return result\n ? {\n r: parseInt(result[1], 16),\n g: parseInt(result[2], 16),\n b: parseInt(result[3], 16),\n }\n : null;\n}\n\nexport function parseColor(color) {\n if (!color) return { h: 0, s: 1, v: 1, a: 1 };\n\n if (color.startsWith(\"#\")) {\n const rgb = hexToRgb(color);\n if (rgb) {\n const hsv = rgbToHsv(rgb.r, rgb.g, rgb.b);\n return { ...hsv, a: 1 };\n }\n }\n\n const rgbaMatch = color.match(\n /^rgba?\\((\\d+),\\s*(\\d+),\\s*(\\d+)(?:,\\s*([\\d.]+))?\\)$/\n );\n if (rgbaMatch) {\n const r = parseInt(rgbaMatch[1], 10);\n const g = parseInt(rgbaMatch[2], 10);\n const b = parseInt(rgbaMatch[3], 10);\n const a = rgbaMatch[4] !== undefined ? parseFloat(rgbaMatch[4]) : 1;\n const hsv = rgbToHsv(r, g, b);\n return { ...hsv, a };\n }\n\n return { h: 0, s: 1, v: 1, a: 1 };\n}\n\nexport function rgbToHsl(r, g, b) {\n r /= 255;\n g /= 255;\n b /= 255;\n\n let max = Math.max(r, g, b),\n min = Math.min(r, g, b);\n let h,\n s,\n l = (max + min) / 2;\n\n if (max === min) {\n h = s = 0;\n } else {\n let d = max - min;\n s = l > 0.5 ? d / (2 - max - min) : d / (max + min);\n switch (max) {\n case r:\n h = (g - b) / d + (g < b ? 6 : 0);\n break;\n case g:\n h = (b - r) / d + 2;\n break;\n case b:\n h = (r - g) / d + 4;\n break;\n default:\n h = 0;\n }\n h /= 6;\n }\n\n return { h: h * 360, s: s, l: l };\n}\n\nexport function hslToRgb(h, s, l) {\n let r, g, b;\n\n if (s === 0) {\n r = g = b = l;\n } else {\n const hue2rgb = (p, q, t) => {\n if (t < 0) t += 1;\n if (t > 1) t -= 1;\n if (t < 1 / 6) return p + (q - p) * 6 * t;\n if (t < 1 / 2) return q;\n if (t < 2 / 3) return p + (q - p) * (2 / 3 - t) * 6;\n return p;\n };\n\n const q = l < 0.5 ? l * (1 + s) : l + s - l * s;\n const p = 2 * l - q;\n h /= 360;\n r = hue2rgb(p, q, h + 1 / 3);\n g = hue2rgb(p, q, h);\n b = hue2rgb(p, q, h - 1 / 3);\n }\n\n return {\n r: Math.round(r * 255),\n g: Math.round(g * 255),\n b: Math.round(b * 255),\n };\n}\n","import React, { useRef, useEffect, useState, useCallback } from \"react\";\nimport { clamp } from \"./utils/color\";\n\nconst ColorBoard = ({ hue, saturation, value, onChange }) => {\n const containerRef = useRef(null);\n const [isDragging, setIsDragging] = useState(false);\n\n const handleChange = useCallback(\n (e) => {\n if (!containerRef.current) return;\n const {\n width,\n height,\n left,\n top,\n } = containerRef.current.getBoundingClientRect();\n const x = clamp(e.clientX - left, 0, width);\n const y = clamp(e.clientY - top, 0, height);\n\n const newSaturation = x / width;\n const newValue = 1 - y / height;\n\n onChange(newSaturation, newValue);\n },\n [onChange]\n );\n\n const handleMouseDown = (e) => {\n setIsDragging(true);\n handleChange(e);\n };\n\n const handleMouseUp = useCallback(() => {\n setIsDragging(false);\n }, []);\n\n useEffect(() => {\n const handleMouseMove = (e) => {\n if (isDragging) {\n handleChange(e);\n }\n };\n\n if (isDragging) {\n window.addEventListener(\"mousemove\", handleMouseMove);\n window.addEventListener(\"mouseup\", handleMouseUp);\n }\n\n return () => {\n window.removeEventListener(\"mousemove\", handleMouseMove);\n window.removeEventListener(\"mouseup\", handleMouseUp);\n };\n }, [isDragging, handleChange, handleMouseUp]);\n\n return (\n <div\n ref={containerRef}\n className=\"color-board\"\n style={{\n backgroundColor: `hsl(${hue}, 100%, 50%)`,\n }}\n onMouseDown={handleMouseDown}\n >\n <div className=\"color-board-white\" />\n <div className=\"color-board-black\" />\n <div\n className=\"color-board-handler\"\n style={{\n left: `${saturation * 100}%`,\n top: `${(1 - value) * 100}%`,\n }}\n />\n </div>\n );\n};\n\nexport default ColorBoard;\n","import React, { useRef, useState, useEffect, useCallback } from \"react\";\nimport { clamp } from \"./utils/color\";\n\nconst Slider = ({ value, max, onChange, className, style, children }) => {\n const containerRef = useRef(null);\n const [isDragging, setIsDragging] = useState(false);\n\n const handleChange = useCallback(\n (e) => {\n if (!containerRef.current) return;\n const { width, left } = containerRef.current.getBoundingClientRect();\n const x = clamp(e.clientX - left, 0, width);\n const newValue = (x / width) * max;\n onChange(newValue);\n },\n [max, onChange]\n );\n\n const handleMouseDown = (e) => {\n setIsDragging(true);\n handleChange(e);\n };\n\n const handleMouseUp = useCallback(() => {\n setIsDragging(false);\n }, []);\n\n useEffect(() => {\n const handleMouseMove = (e) => {\n if (isDragging) {\n handleChange(e);\n }\n };\n\n if (isDragging) {\n window.addEventListener(\"mousemove\", handleMouseMove);\n window.addEventListener(\"mouseup\", handleMouseUp);\n }\n\n return () => {\n window.removeEventListener(\"mousemove\", handleMouseMove);\n window.removeEventListener(\"mouseup\", handleMouseUp);\n };\n }, [isDragging, handleChange, handleMouseUp]);\n\n return (\n <div\n ref={containerRef}\n className={`color-slider ${className || \"\"}`}\n style={style}\n onMouseDown={handleMouseDown}\n >\n <div\n className=\"color-slider-handler\"\n style={{\n left: `${(value / max) * 100}%`,\n }}\n />\n {children}\n </div>\n );\n};\n\nexport const HueSlider = ({ hue, onChange }) => {\n return (\n <Slider value={hue} max={360} onChange={onChange} className=\"hue-slider\" />\n );\n};\n\nexport const AlphaSlider = ({ alpha, color, onChange }) => {\n const { r, g, b } = color;\n return (\n <Slider\n value={alpha}\n max={1}\n onChange={onChange}\n className=\"alpha-slider-bg\"\n style={{\n background: `linear-gradient(to right, rgba(${r},${g},${b},0) 0%, rgba(${r},${g},${b},1) 100%)`,\n }}\n />\n );\n};\n","import React, { useState, useEffect, useCallback, useRef } from \"react\";\nimport {\n rgbToHex,\n hexToRgb,\n hsvToRgb,\n rgbToHsv,\n rgbToHsl,\n hslToRgb,\n} from \"./utils/color\";\n\nconst ColorInput = ({ hue, saturation, value, alpha, onChange }) => {\n const [mode, setMode] = useState(\"HEX\");\n const [localValue, setLocalValue] = useState({});\n const [showDropdown, setShowDropdown] = useState(false);\n const dropdownRef = useRef(null);\n\n // 点击外部关闭下拉菜单\n useEffect(() => {\n const handleClickOutside = (event) => {\n if (dropdownRef.current && !dropdownRef.current.contains(event.target)) {\n setShowDropdown(false);\n }\n };\n document.addEventListener(\"mousedown\", handleClickOutside);\n return () => {\n document.removeEventListener(\"mousedown\", handleClickOutside);\n };\n }, []);\n\n const getRgb = useCallback(() => hsvToRgb(hue, saturation, value), [\n hue,\n saturation,\n value,\n ]);\n\n useEffect(() => {\n const rgb = getRgb();\n if (mode === \"HEX\") {\n setLocalValue({ hex: rgbToHex(rgb.r, rgb.g, rgb.b) });\n } else if (mode === \"RGB\") {\n setLocalValue({ r: rgb.r, g: rgb.g, b: rgb.b });\n } else if (mode === \"HSL\") {\n const hsl = rgbToHsl(rgb.r, rgb.g, rgb.b);\n setLocalValue({\n h: Math.round(hsl.h),\n s: Math.round(hsl.s * 100),\n l: Math.round(hsl.l * 100),\n });\n }\n }, [hue, saturation, value, mode, getRgb]);\n\n const handleHexChange = (e) => {\n const val = e.target.value;\n setLocalValue({ ...localValue, hex: val });\n if (/^#?([0-9A-F]{3}|[0-9A-F]{6})$/i.test(val)) {\n const rgb = hexToRgb(val);\n if (rgb) {\n const hsv = rgbToHsv(rgb.r, rgb.g, rgb.b);\n onChange({ ...hsv, a: alpha });\n }\n }\n };\n\n const handleRgbChange = (key, val) => {\n const newValue = { ...localValue, [key]: val };\n setLocalValue(newValue);\n const r = parseInt(newValue.r, 10);\n const g = parseInt(newValue.g, 10);\n const b = parseInt(newValue.b, 10);\n if (!isNaN(r) && !isNaN(g) && !isNaN(b)) {\n const hsv = rgbToHsv(\n Math.min(255, Math.max(0, r)),\n Math.min(255, Math.max(0, g)),\n Math.min(255, Math.max(0, b))\n );\n onChange({ ...hsv, a: alpha });\n }\n };\n\n const handleHslChange = (key, val) => {\n const newValue = { ...localValue, [key]: val };\n setLocalValue(newValue);\n const h = parseInt(newValue.h, 10);\n const s = parseInt(newValue.s, 10);\n const l = parseInt(newValue.l, 10);\n if (!isNaN(h) && !isNaN(s) && !isNaN(l)) {\n const rgb = hslToRgb(\n Math.min(360, Math.max(0, h)),\n Math.min(100, Math.max(0, s)) / 100,\n Math.min(100, Math.max(0, l)) / 100\n );\n const hsv = rgbToHsv(rgb.r, rgb.g, rgb.b);\n onChange({ ...hsv, a: alpha });\n }\n };\n\n return (\n <div className=\"color-input-container\">\n <div\n className=\"mode-selector\"\n ref={dropdownRef}\n onClick={() => setShowDropdown(!showDropdown)}\n >\n <span>{mode.charAt(0) + mode.slice(1).toLowerCase()}</span>\n <span\n className=\"arrow\"\n style={{\n fontSize: \"10px\",\n marginLeft: \"4px\",\n transform: showDropdown ? \"rotate(180deg)\" : \"rotate(0deg)\",\n display: \"inline-block\",\n transition: \"transform 0.2s\",\n color: \"#8c8c8c\",\n }}\n >\n <svg\n viewBox=\"0 0 1024 1024\"\n width=\"10\"\n height=\"10\"\n fill=\"currentColor\"\n >\n <path d=\"M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3 0.1-12.7-6.4-12.7z\" />\n </svg>\n </span>\n {showDropdown && (\n <div className=\"mode-dropdown\">\n <div\n className=\"mode-option\"\n onClick={(e) => {\n e.stopPropagation();\n setMode(\"HEX\");\n setShowDropdown(false);\n }}\n >\n Hex\n </div>\n <div\n className=\"mode-option\"\n onClick={(e) => {\n e.stopPropagation();\n setMode(\"RGB\");\n setShowDropdown(false);\n }}\n >\n RGB\n </div>\n <div\n className=\"mode-option\"\n onClick={(e) => {\n e.stopPropagation();\n setMode(\"HSL\");\n setShowDropdown(false);\n }}\n >\n HSL\n </div>\n </div>\n )}\n </div>\n\n <div className=\"color-input-fields\">\n {mode === \"HEX\" && (\n <div className=\"hex-input-wrapper\">\n <span className=\"hex-prefix\">#</span>\n <input\n className=\"color-input hex\"\n value={localValue.hex ? localValue.hex.replace(\"#\", \"\") : \"\"}\n onChange={handleHexChange}\n />\n </div>\n )}\n {mode === \"RGB\" && (\n <>\n <input\n className=\"color-input\"\n type=\"number\"\n placeholder=\"R\"\n value={localValue.r !== undefined ? localValue.r : \"\"}\n onChange={(e) => handleRgbChange(\"r\", e.target.value)}\n />\n <input\n className=\"color-input\"\n type=\"number\"\n placeholder=\"G\"\n value={localValue.g !== undefined ? localValue.g : \"\"}\n onChange={(e) => handleRgbChange(\"g\", e.target.value)}\n />\n <input\n className=\"color-input\"\n type=\"number\"\n placeholder=\"B\"\n value={localValue.b !== undefined ? localValue.b : \"\"}\n onChange={(e) => handleRgbChange(\"b\", e.target.value)}\n />\n </>\n )}\n {mode === \"HSL\" && (\n <>\n <input\n className=\"color-input\"\n type=\"number\"\n placeholder=\"H\"\n value={localValue.h !== undefined ? localValue.h : \"\"}\n onChange={(e) => handleHslChange(\"h\", e.target.value)}\n />\n <input\n className=\"color-input\"\n type=\"number\"\n placeholder=\"S\"\n value={localValue.s !== undefined ? localValue.s : \"\"}\n onChange={(e) => handleHslChange(\"s\", e.target.value)}\n />\n <input\n className=\"color-input\"\n type=\"number\"\n placeholder=\"L\"\n value={localValue.l !== undefined ? localValue.l : \"\"}\n onChange={(e) => handleHslChange(\"l\", e.target.value)}\n />\n </>\n )}\n <div className=\"color-input alpha-display\">\n {Math.round(alpha * 100)}%\n </div>\n </div>\n </div>\n );\n};\n\nexport default ColorInput;\n","import React, { useState, useRef, useEffect } from \"react\";\nimport ReactDOM from \"react-dom\";\nimport ColorBoard from \"./ColorBoard\";\nimport { HueSlider, AlphaSlider } from \"./Sliders\";\nimport ColorInput from \"./ColorInput\";\nimport {\n hsvToRgb,\n rgbToHex,\n parseColor,\n hexToRgb,\n rgbToHsv,\n} from \"./utils/color\";\nimport \"./index.css\";\n\nconst DEFAULT_PRESETS = [\n \"#E0B5AE\",\n \"#B2BBDE\",\n \"#F2DDB3\",\n \"#E0E5C5\",\n \"#BBD0C3\",\n \"#B5D1E3\",\n \"#FFFFFF\",\n \"#D25536\",\n \"#EFA154\",\n \"#F7DA7E\",\n \"#5FA67F\",\n \"#A2829D\",\n \"#D390A2\",\n \"#000000\",\n \"#0099A4\",\n \"#EABA00\",\n \"#C9462C\",\n \"#3171AC\",\n \"#783780\",\n \"#1E80EA\",\n \"#2AAC3B\",\n \"#B63455\",\n \"#81532F\",\n \"#AA9A5C\",\n \"#828281\",\n \"#055753\",\n \"#8F262B\",\n \"#F0D8D0\",\n];\n\nconst ColorPicker = ({\n value,\n defaultValue,\n onChange,\n showLabel = true,\n label = \"Color\",\n showArrow = true,\n showInput = true,\n showColorBoard = true,\n presets: customPresets,\n}) => {\n const [isOpen, setIsOpen] = useState(false);\n const [isExpanded, setIsExpanded] = useState(false);\n const [recentColors, setRecentColors] = useState([]);\n const presets = customPresets || DEFAULT_PRESETS;\n\n const [color, setColor] = useState(() => {\n const initColor = value || defaultValue || \"#1677ff\";\n return parseColor(initColor);\n });\n\n const [inputValue, setInputValue] = useState(() => {\n const rgb = hsvToRgb(color.h, color.s, color.v);\n return rgbToHex(rgb.r, rgb.g, rgb.b).toUpperCase();\n });\n\n const containerRef = useRef(null);\n const triggerRef = useRef(null);\n const [panelStyle, setPanelStyle] = useState({});\n\n useEffect(() => {\n if (value !== undefined) {\n const newColor = parseColor(value);\n setColor(newColor);\n const rgb = hsvToRgb(newColor.h, newColor.s, newColor.v);\n setInputValue(rgbToHex(rgb.r, rgb.g, rgb.b).toUpperCase());\n }\n }, [value]);\n\n const handleChange = (newColor) => {\n const nextColor = { ...color, ...newColor };\n setColor(nextColor);\n\n const rgb = hsvToRgb(nextColor.h, nextColor.s, nextColor.v);\n const hex = rgbToHex(rgb.r, rgb.g, rgb.b).toUpperCase();\n setInputValue(hex);\n\n if (onChange) {\n onChange(hex, { ...rgb, a: nextColor.a });\n }\n };\n\n const handleInputChange = (e) => {\n const val = e.target.value;\n setInputValue(val);\n\n if (/^#?([0-9A-F]{3}|[0-9A-F]{6})$/i.test(val)) {\n const rgb = hexToRgb(val);\n if (rgb) {\n const hsv = rgbToHsv(rgb.r, rgb.g, rgb.b);\n handleChange({ ...hsv, a: color.a });\n }\n }\n };\n\n useEffect(() => {\n if (\n !isOpen ||\n !triggerRef.current ||\n typeof window === \"undefined\" ||\n typeof document === \"undefined\"\n ) {\n return;\n }\n\n const triggerRect = triggerRef.current.getBoundingClientRect();\n const top = triggerRect.bottom + 4 + window.scrollY;\n const left = triggerRect.left + window.scrollX;\n\n setPanelStyle({\n position: \"absolute\",\n top,\n left,\n zIndex: 9999,\n });\n }, [isOpen]);\n\n const handleEyeDropper = async () => {\n if (!window.EyeDropper) {\n alert(\"当前浏览器不支持屏幕取色功能\");\n return;\n }\n\n try {\n const eyeDropper = new window.EyeDropper();\n const result = await eyeDropper.open();\n const { sRGBHex } = result;\n const rgb = hexToRgb(sRGBHex);\n if (rgb) {\n const hsv = rgbToHsv(rgb.r, rgb.g, rgb.b);\n handleChange({ ...hsv, a: 1 });\n }\n } catch (e) {\n // 用户取消取色或发生错误\n console.log(\"EyeDropper failed or canceled:\", e);\n }\n };\n\n useEffect(() => {\n const handleClickOutside = (event) => {\n if (\n containerRef.current &&\n !containerRef.current.contains(event.target)\n ) {\n setIsOpen(false);\n }\n };\n\n if (isOpen) {\n document.addEventListener(\"mousedown\", handleClickOutside);\n } else {\n const rgb = hsvToRgb(color.h, color.s, color.v);\n const currentHex = rgbToHex(rgb.r, rgb.g, rgb.b).toUpperCase();\n setRecentColors((prev) => {\n if (prev.includes(currentHex)) return prev;\n return [currentHex, ...prev].slice(0, 10);\n });\n }\n\n return () => {\n document.removeEventListener(\"mousedown\", handleClickOutside);\n };\n }, [isOpen, color]);\n\n const rgb = hsvToRgb(color.h, color.s, color.v);\n const displayColor = `rgba(${rgb.r}, ${rgb.g}, ${rgb.b}, ${color.a})`;\n const initialLimit = 14;\n const visiblePresets = isExpanded ? presets : presets.slice(0, initialLimit);\n const showExpand = presets.length > initialLimit;\n\n const panel = isOpen ? (\n <div className=\"color-picker-panel\" style={panelStyle}>\n {showColorBoard && (\n <div\n className=\"color-picker-board-wrapper\"\n style={{\n marginTop: \"10px\",\n paddingTop: \"10px\",\n borderTop: \"1px solid #eee\",\n }}\n >\n <ColorBoard\n hue={color.h}\n saturation={color.s}\n value={color.v}\n onChange={(s, v) => handleChange({ s, v })}\n />\n <HueSlider hue={color.h} onChange={(h) => handleChange({ h })} />\n <AlphaSlider\n alpha={color.a}\n color={rgb}\n onChange={(a) => handleChange({ a })}\n />\n <ColorInput\n hue={color.h}\n saturation={color.s}\n value={color.v}\n alpha={color.a}\n onChange={(newHsv) => handleChange(newHsv)}\n />\n </div>\n )}\n <div className=\"color-picker-presets\">\n <div className=\"palette-section-title\" style={{ marginTop: 8 }}>\n <span>Recommended</span>\n <span\n className=\"color-picker-icon-right\"\n onClick={handleEyeDropper}\n title=\"屏幕取色\"\n >\n <svg\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <defs>\n <rect id=\"path-1\" x=\"0\" y=\"0\" width=\"16\" height=\"16\" />\n </defs>\n <g stroke=\"none\" strokeWidth=\"1\" fill=\"none\" fillRule=\"evenodd\">\n <g transform=\"translate(-920.000000, -594.000000)\">\n <g transform=\"translate(720.000000, 418.000000)\">\n <g transform=\"translate(200.000000, 176.000000)\">\n <mask id=\"mask-2\" fill=\"white\">\n <use xlinkHref=\"#path-1\" />\n </mask>\n <g />\n <g\n mask=\"url(#mask-2)\"\n fill=\"#000000\"\n fillOpacity=\"0.85\"\n fillRule=\"nonzero\"\n >\n <g transform=\"translate(8.106532, 8.106532) rotate(-315.000000) translate(-8.106532, -8.106532) translate(-0.266667, -0.266667)\">\n <path d=\"M5.67238576,2.96585378 L6.99478644,4.28811977 L7.03978941,4.24867364 C7.66833128,3.72977631 8.60030981,3.76436946 9.18839345,4.3524531 L9.94264069,5.10670034 C10.1509203,5.31497996 10.1509203,5.65266795 9.94264069,5.86094757 L9.18778644,6.61411977 L13.7138769,11.1406782 C14.4428555,11.8696569 14.4428555,13.0515648 13.7138769,13.7805435 C12.9848982,14.5095222 11.8029902,14.5095222 11.0740115,13.7805435 L6.54778644,9.25411977 L5.7942809,10.0093074 C5.58600128,10.217587 5.24831329,10.217587 5.04003367,10.0093074 L4.28578644,9.25506012 C3.66094757,8.63022125 3.66094757,7.61715729 4.28578644,6.99231842 L4.35178644,6.92511977 L3.03252045,5.6057191 C2.30354177,4.87674042 2.30354177,3.69483246 3.03252045,2.96585378 C3.76149912,2.2368751 4.94340708,2.2368751 5.67238576,2.96585378 Z M8.43414622,7.36944204 L7.86778644,7.93411977 L7.30277537,8.50081289 L11.8282588,13.0262963 C12.1295204,13.3275579 12.6112769,13.3383172 12.925431,13.0585743 L12.9596296,13.0262963 C13.2720491,12.7138769 13.2720491,12.2073449 12.9596296,11.8949254 L8.43414622,7.36944204 Z M7.70907857,5.07958956 L7.67989899,5.10670034 L5.04003367,7.74656565 C4.83175405,7.95484528 4.83175405,8.29253326 5.04003367,8.50081289 L5.41715729,8.8779365 L8.81126984,5.48382395 L8.43414622,5.10670034 C8.23533385,4.90788797 7.91861014,4.89885105 7.70907857,5.07958956 Z M3.82096628,3.68782298 L3.78676768,3.72010101 C3.47434825,4.03252045 3.47434825,4.53905243 3.78676768,4.85147186 L5.10670034,6.17140452 L6.23807119,5.04003367 L4.91813853,3.72010101 C4.61687693,3.41883942 4.13512038,3.40808007 3.82096628,3.68782298 Z\" transform=\"translate(8.373199, 8.373199) rotate(-315.000000) translate(-8.373199, -8.373199)\" />\n </g>\n </g>\n </g>\n </g>\n </g>\n </g>\n </svg>\n </span>\n </div>\n <div className={`presets-grid modern`}>\n {presets.map((preset, idx) => (\n <div\n key={idx}\n className=\"preset-item preset-item-inner\"\n style={{ backgroundColor: preset }}\n onClick={() => {\n const rgbValue = hexToRgb(preset);\n if (rgbValue) {\n const hsv = rgbToHsv(rgbValue.r, rgbValue.g, rgbValue.b);\n handleChange({ ...hsv, a: 1 });\n }\n }}\n title={preset}\n />\n ))}\n </div>\n {/* {showExpand && (\n <div\n className=\"presets-collapse\"\n onClick={() => setIsExpanded(!isExpanded)}\n >\n {isExpanded ? \"Less\" : \"More\"}\n <span className={`collapse-arrow ${isExpanded ? \"expanded\" : \"\"}`}>\n ▼\n </span>\n </div>\n )} */}\n\n {recentColors.length > 0 && (\n <>\n <div className=\"palette-section-title\">Recent</div>\n <div className=\"presets-grid recent\">\n {recentColors.map((recentColor, idx) => (\n <div\n key={idx}\n className=\"preset-item\"\n style={{ backgroundColor: recentColor }}\n onClick={() => {\n const rgbValue = hexToRgb(recentColor);\n if (rgbValue) {\n const hsv = rgbToHsv(\n rgbValue.r,\n rgbValue.g,\n rgbValue.b\n );\n handleChange({ ...hsv, a: 1 });\n }\n }}\n title={recentColor}\n />\n ))}\n </div>\n </>\n )}\n </div>\n </div>\n ) : null;\n\n return (\n <div className=\"color-picker-container\" ref={containerRef}>\n <div className=\"color-picker-main-row\">\n <div className=\"color-picker-tooltip-trigger\">\n {showLabel && <span className=\"color-picker-label\">{label}</span>}\n\n <div\n className={`color-picker-trigger ${isOpen ? \"is-open\" : \"\"}`}\n onClick={() => setIsOpen(!isOpen)}\n ref={triggerRef}\n >\n <div\n className=\"color-block\"\n style={{ backgroundColor: displayColor }}\n />\n {showArrow && (\n <span className={`color-picker-arrow ${isOpen ? \"open\" : \"\"}`}>\n <svg\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <g stroke=\"none\" strokeWidth=\"1\" fill=\"none\" fillRule=\"evenodd\">\n <g\n transform=\"translate(-1348.000000, -88.000000)\"\n fillRule=\"nonzero\"\n >\n <g transform=\"translate(0.000000, 60.000000)\">\n <g transform=\"translate(584.000000, 20.000000)\">\n <g transform=\"translate(728.000000, 4.000000)\">\n <g transform=\"translate(44.000000, 12.000000) rotate(-360.000000) translate(-44.000000, -12.000000) translate(36.000000, 4.000000)\">\n <rect\n fill=\"#000000\"\n opacity=\"0\"\n x=\"0\"\n y=\"0\"\n width=\"16\"\n height=\"16\"\n />\n <path\n d=\"M13.0750341,5.34788541 C12.9440655,5.21691678 12.7257845,5.21691678 12.5948158,5.34788541 L8.01091405,9.93178717 L3.40518417,5.34788541 C3.27421555,5.21691678 3.05593452,5.21691678 2.92496589,5.34788541 C2.79399727,5.47885403 2.79399727,5.69713506 2.92496589,5.82810369 L7.77080491,10.6521146 C7.90177353,10.7830832 8.12005456,10.7830832 8.25102319,10.6521146 L13.0750341,5.82810369 C13.2060027,5.69713506 13.2060027,5.47885403 13.0750341,5.34788541 Z\"\n stroke=\"#FFFFFF\"\n />\n </g>\n </g>\n </g>\n </g>\n </g>\n </g>\n </svg>\n </span>\n )}\n <span className=\"tooltip-text\">Color Picker</span>\n </div>\n </div>\n\n {showInput && (\n <div className=\"color-picker-input-wrapper\">\n <input\n type=\"text\"\n value={inputValue}\n onChange={handleInputChange}\n placeholder=\"Please input color\"\n />\n {inputValue && (\n <span\n className=\"input-clear-icon\"\n onClick={() => setInputValue(\"\")}\n >\n <img\n src=\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAA8klEQVQ4T51SwVHDQAzcdQOETugAqISkg/Cw9CRf2Q+gAkwlJB1QimnAYnRz57m55AG5l2+9K632RFw44zg+ALiPX+5+FJFTS2MNmNme5AuATUOcARxE5L3gq9DMJpJPlxxU2CQiu7gnYe70mq19tgXcfcXc/VlV34pwJnkTBFXdDsOwBfCRO+1EZKoczSJyywjC3b8qO4mYxai+SyGQfKSZHXIg9XhJHEDTPXHC7vXCq63mVP8cjrv/qOrm7DkAxGyRan1qLM3/rwUoz7UuQCkdixCrFW9atwt7JPcl6TNhIUdgy7Lcxb3ruu++74/tKv4CNXed5xhXezYAAAAASUVORK5CYII=\"\n alt=\"\"\n width=\"12\"\n height=\"12\"\n />\n </span>\n )}\n </div>\n )}\n </div>\n\n {typeof document !== \"undefined\" &&\n ReactDOM.createPortal(panel, document.body)}\n\n <div>\n <div className={`presets-grid modern`}>\n {visiblePresets.map((preset, idx) => (\n <div\n key={idx}\n className=\"preset-item\"\n style={{ backgroundColor: preset }}\n onClick={() => {\n const rgb = hexToRgb(preset);\n if (rgb) {\n const hsv = rgbToHsv(rgb.r, rgb.g, rgb.b);\n handleChange({ ...hsv, a: 1 });\n }\n }}\n title={preset}\n />\n ))}\n </div>\n {showExpand && (\n <div\n className=\"presets-collapse\"\n onClick={() => setIsExpanded(!isExpanded)}\n >\n {isExpanded ? \"Less\" : \"More\"}\n <span className={`collapse-arrow ${isExpanded ? \"expanded\" : \"\"}`}>\n ▼\n </span>\n </div>\n )}\n </div>\n </div>\n );\n};\n\nexport default ColorPicker;\n"],"names":["clamp","value","min","max","Math","hsvToRgb","h","s","v","r","g","b","i","floor","f","p","q","t","round","rgbToHsv","d","rgbToHex","toHex","c","hex","toString","length","hexToRgb","replace","m","result","exec","parseInt","parseColor","color","a","startsWith","rgb","rgbaMatch","match","undefined","parseFloat","ColorBoard","hue","saturation","onChange","containerRef","useRef","isDragging","setIsDragging","useState","handleChange","useCallback","e","current","width","height","left","top","getBoundingClientRect","x","clientX","y","clientY","handleMouseUp","useEffect","handleMouseMove","window","addEventListener","removeEventListener","React","createElement","ref","className","style","backgroundColor","onMouseDown","Slider","children","HueSlider","AlphaSlider","alpha","background","ColorInput","mode","setMode","localValue","setLocalValue","showDropdown","setShowDropdown","dropdownRef","handleClickOutside","event","contains","target","document","getRgb","hsl","l","rgbToHsl","handleRgbChange","key","val","newValue","isNaN","hsv","handleHslChange","hue2rgb","hslToRgb","onClick","charAt","slice","toLowerCase","fontSize","marginLeft","transform","display","transition","viewBox","fill","stopPropagation","test","Fragment","type","placeholder","DEFAULT_PRESETS","_ref","defaultValue","showLabel","label","showArrow","showInput","showColorBoard","presets","customPresets","isOpen","setIsOpen","isExpanded","setIsExpanded","recentColors","setRecentColors","setColor","inputValue","setInputValue","toUpperCase","triggerRef","panelStyle","setPanelStyle","newColor","nextColor","_extends","triggerRect","bottom","scrollY","scrollX","position","zIndex","currentHex","prev","includes","displayColor","visiblePresets","showExpand","panel","marginTop","paddingTop","borderTop","newHsv","handleEyeDropper","EyeDropper","alert","Promise","resolve","_temp","body","recover","eyeDropper","open","then","sRGBHex","_catch","console","log","reject","title","xmlns","id","stroke","strokeWidth","fillRule","xlinkHref","mask","fillOpacity","map","preset","idx","rgbValue","recentColor","opacity","src","alt","ReactDOM","createPortal"],"mappings":"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"}
1
+ {"version":3,"file":"index.js","sources":["../src/lib/utils/color.js","../src/lib/ColorBoard.js","../src/lib/Sliders.js","../src/lib/ColorInput.js","../src/lib/index.js"],"sourcesContent":["export function clamp(value, min, max) {\n return Math.min(Math.max(value, min), max);\n}\n\nexport function hsvToRgb(h, s, v) {\n h = ((h % 360) + 360) % 360;\n let r, g, b;\n let i = Math.floor(h / 60);\n let f = h / 60 - i;\n let p = v * (1 - s);\n let q = v * (1 - f * s);\n let t = v * (1 - (1 - f) * s);\n\n switch (i % 6) {\n case 0:\n r = v;\n g = t;\n b = p;\n break;\n case 1:\n r = q;\n g = v;\n b = p;\n break;\n case 2:\n r = p;\n g = v;\n b = t;\n break;\n case 3:\n r = p;\n g = q;\n b = v;\n break;\n case 4:\n r = t;\n g = p;\n b = v;\n break;\n case 5:\n r = v;\n g = p;\n b = q;\n break;\n default:\n r = 0;\n g = 0;\n b = 0;\n }\n\n return {\n r: Math.round(r * 255),\n g: Math.round(g * 255),\n b: Math.round(b * 255),\n };\n}\n\nexport function rgbToHsv(r, g, b) {\n r /= 255;\n g /= 255;\n b /= 255;\n\n let max = Math.max(r, g, b);\n let min = Math.min(r, g, b);\n let h,\n s,\n v = max;\n\n let d = max - min;\n s = max === 0 ? 0 : d / max;\n\n if (max === min) {\n h = 0;\n } else {\n switch (max) {\n case r:\n h = (g - b) / d + (g < b ? 6 : 0);\n break;\n case g:\n h = (b - r) / d + 2;\n break;\n case b:\n h = (r - g) / d + 4;\n break;\n default:\n h = 0;\n }\n h /= 6;\n }\n\n return {\n h: h * 360,\n s: s,\n v: v,\n };\n}\n\nexport function rgbToHex(r, g, b) {\n const toHex = (c) => {\n const hex = Math.round(c).toString(16);\n return hex.length === 1 ? \"0\" + hex : hex;\n };\n return \"#\" + toHex(r) + toHex(g) + toHex(b);\n}\n\nexport function hexToRgb(hex) {\n const shorthandRegex = /^#?([a-f\\d])([a-f\\d])([a-f\\d])$/i;\n hex = hex.replace(shorthandRegex, function(m, r, g, b) {\n return r + r + g + g + b + b;\n });\n\n const result = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(hex);\n return result\n ? {\n r: parseInt(result[1], 16),\n g: parseInt(result[2], 16),\n b: parseInt(result[3], 16),\n }\n : null;\n}\n\nexport function parseColor(color) {\n if (!color) return { h: 0, s: 1, v: 1, a: 1 };\n\n if (color.startsWith(\"#\")) {\n const rgb = hexToRgb(color);\n if (rgb) {\n const hsv = rgbToHsv(rgb.r, rgb.g, rgb.b);\n return { ...hsv, a: 1 };\n }\n }\n\n const rgbaMatch = color.match(\n /^rgba?\\((\\d+),\\s*(\\d+),\\s*(\\d+)(?:,\\s*([\\d.]+))?\\)$/\n );\n if (rgbaMatch) {\n const r = parseInt(rgbaMatch[1], 10);\n const g = parseInt(rgbaMatch[2], 10);\n const b = parseInt(rgbaMatch[3], 10);\n const a = rgbaMatch[4] !== undefined ? parseFloat(rgbaMatch[4]) : 1;\n const hsv = rgbToHsv(r, g, b);\n return { ...hsv, a };\n }\n\n return { h: 0, s: 1, v: 1, a: 1 };\n}\n\nexport function rgbToHsl(r, g, b) {\n r /= 255;\n g /= 255;\n b /= 255;\n\n let max = Math.max(r, g, b),\n min = Math.min(r, g, b);\n let h,\n s,\n l = (max + min) / 2;\n\n if (max === min) {\n h = s = 0;\n } else {\n let d = max - min;\n s = l > 0.5 ? d / (2 - max - min) : d / (max + min);\n switch (max) {\n case r:\n h = (g - b) / d + (g < b ? 6 : 0);\n break;\n case g:\n h = (b - r) / d + 2;\n break;\n case b:\n h = (r - g) / d + 4;\n break;\n default:\n h = 0;\n }\n h /= 6;\n }\n\n return { h: h * 360, s: s, l: l };\n}\n\nexport function hslToRgb(h, s, l) {\n let r, g, b;\n\n if (s === 0) {\n r = g = b = l;\n } else {\n const hue2rgb = (p, q, t) => {\n if (t < 0) t += 1;\n if (t > 1) t -= 1;\n if (t < 1 / 6) return p + (q - p) * 6 * t;\n if (t < 1 / 2) return q;\n if (t < 2 / 3) return p + (q - p) * (2 / 3 - t) * 6;\n return p;\n };\n\n const q = l < 0.5 ? l * (1 + s) : l + s - l * s;\n const p = 2 * l - q;\n h /= 360;\n r = hue2rgb(p, q, h + 1 / 3);\n g = hue2rgb(p, q, h);\n b = hue2rgb(p, q, h - 1 / 3);\n }\n\n return {\n r: Math.round(r * 255),\n g: Math.round(g * 255),\n b: Math.round(b * 255),\n };\n}\n","import React, { useRef, useEffect, useState, useCallback } from \"react\";\nimport { clamp } from \"./utils/color\";\n\nconst ColorBoard = ({ hue, saturation, value, onChange, onComplete }) => {\n const containerRef = useRef(null);\n const [isDragging, setIsDragging] = useState(false);\n\n const handleChange = useCallback(\n (e) => {\n if (!containerRef.current) return;\n const {\n width,\n height,\n left,\n top,\n } = containerRef.current.getBoundingClientRect();\n const x = clamp(e.clientX - left, 0, width);\n const y = clamp(e.clientY - top, 0, height);\n\n const newSaturation = x / width;\n const newValue = 1 - y / height;\n\n onChange(newSaturation, newValue);\n },\n [onChange]\n );\n\n const handleMouseDown = (e) => {\n setIsDragging(true);\n handleChange(e);\n };\n\n const handleMouseUp = useCallback(() => {\n setIsDragging(false);\n if (onComplete) {\n onComplete();\n }\n }, [onComplete]);\n\n useEffect(() => {\n const handleMouseMove = (e) => {\n if (isDragging) {\n handleChange(e);\n }\n };\n\n if (isDragging) {\n window.addEventListener(\"mousemove\", handleMouseMove);\n window.addEventListener(\"mouseup\", handleMouseUp);\n }\n\n return () => {\n window.removeEventListener(\"mousemove\", handleMouseMove);\n window.removeEventListener(\"mouseup\", handleMouseUp);\n };\n }, [isDragging, handleChange, handleMouseUp]);\n\n return (\n <div\n ref={containerRef}\n className=\"color-board\"\n style={{\n backgroundColor: `hsl(${hue}, 100%, 50%)`,\n }}\n onMouseDown={handleMouseDown}\n >\n <div className=\"color-board-white\" />\n <div className=\"color-board-black\" />\n <div\n className=\"color-board-handler\"\n style={{\n left: `${saturation * 100}%`,\n top: `${(1 - value) * 100}%`,\n }}\n />\n </div>\n );\n};\n\nexport default ColorBoard;\n","import React, { useRef, useState, useEffect, useCallback } from \"react\";\nimport { clamp } from \"./utils/color\";\n\nconst Slider = ({ value, max, onChange, className, style, children }) => {\n const containerRef = useRef(null);\n const [isDragging, setIsDragging] = useState(false);\n\n const handleChange = useCallback(\n (e) => {\n if (!containerRef.current) return;\n const { width, left } = containerRef.current.getBoundingClientRect();\n const x = clamp(e.clientX - left, 0, width);\n const newValue = (x / width) * max;\n onChange(newValue);\n },\n [max, onChange]\n );\n\n const handleMouseDown = (e) => {\n setIsDragging(true);\n handleChange(e);\n };\n\n const handleMouseUp = useCallback(() => {\n setIsDragging(false);\n }, []);\n\n useEffect(() => {\n const handleMouseMove = (e) => {\n if (isDragging) {\n handleChange(e);\n }\n };\n\n if (isDragging) {\n window.addEventListener(\"mousemove\", handleMouseMove);\n window.addEventListener(\"mouseup\", handleMouseUp);\n }\n\n return () => {\n window.removeEventListener(\"mousemove\", handleMouseMove);\n window.removeEventListener(\"mouseup\", handleMouseUp);\n };\n }, [isDragging, handleChange, handleMouseUp]);\n\n return (\n <div\n ref={containerRef}\n className={`color-slider ${className || \"\"}`}\n style={style}\n onMouseDown={handleMouseDown}\n >\n <div\n className=\"color-slider-handler\"\n style={{\n left: `${(value / max) * 100}%`,\n }}\n />\n {children}\n </div>\n );\n};\n\nexport const HueSlider = ({ hue, onChange }) => {\n return (\n <Slider value={hue} max={360} onChange={onChange} className=\"hue-slider\" />\n );\n};\n\nexport const AlphaSlider = ({ alpha, color, onChange }) => {\n const { r, g, b } = color;\n return (\n <Slider\n value={alpha}\n max={1}\n onChange={onChange}\n className=\"alpha-slider-bg\"\n style={{\n background: `linear-gradient(to right, rgba(${r},${g},${b},0) 0%, rgba(${r},${g},${b},1) 100%)`,\n }}\n />\n );\n};\n","import React, { useState, useEffect, useCallback, useRef } from \"react\";\nimport {\n rgbToHex,\n hexToRgb,\n hsvToRgb,\n rgbToHsv,\n rgbToHsl,\n hslToRgb,\n} from \"./utils/color\";\n\nconst ColorInput = ({ hue, saturation, value, alpha, onChange }) => {\n const [mode, setMode] = useState(\"HEX\");\n const [localValue, setLocalValue] = useState({});\n const [showDropdown, setShowDropdown] = useState(false);\n const dropdownRef = useRef(null);\n\n // 点击外部关闭下拉菜单\n useEffect(() => {\n const handleClickOutside = (event) => {\n if (dropdownRef.current && !dropdownRef.current.contains(event.target)) {\n setShowDropdown(false);\n }\n };\n document.addEventListener(\"mousedown\", handleClickOutside);\n return () => {\n document.removeEventListener(\"mousedown\", handleClickOutside);\n };\n }, []);\n\n const getRgb = useCallback(() => hsvToRgb(hue, saturation, value), [\n hue,\n saturation,\n value,\n ]);\n\n useEffect(() => {\n const rgb = getRgb();\n if (mode === \"HEX\") {\n setLocalValue({ hex: rgbToHex(rgb.r, rgb.g, rgb.b) });\n } else if (mode === \"RGB\") {\n setLocalValue({ r: rgb.r, g: rgb.g, b: rgb.b });\n } else if (mode === \"HSL\") {\n const hsl = rgbToHsl(rgb.r, rgb.g, rgb.b);\n setLocalValue({\n h: Math.round(hsl.h),\n s: Math.round(hsl.s * 100),\n l: Math.round(hsl.l * 100),\n });\n }\n }, [hue, saturation, value, mode, getRgb]);\n\n const handleHexChange = (e) => {\n const val = e.target.value;\n setLocalValue({ ...localValue, hex: val });\n if (/^#?([0-9A-F]{3}|[0-9A-F]{6})$/i.test(val)) {\n const rgb = hexToRgb(val);\n if (rgb) {\n const hsv = rgbToHsv(rgb.r, rgb.g, rgb.b);\n onChange({ ...hsv, a: alpha });\n }\n }\n };\n\n const handleRgbChange = (key, val) => {\n const newValue = { ...localValue, [key]: val };\n setLocalValue(newValue);\n const r = parseInt(newValue.r, 10);\n const g = parseInt(newValue.g, 10);\n const b = parseInt(newValue.b, 10);\n if (!isNaN(r) && !isNaN(g) && !isNaN(b)) {\n const hsv = rgbToHsv(\n Math.min(255, Math.max(0, r)),\n Math.min(255, Math.max(0, g)),\n Math.min(255, Math.max(0, b))\n );\n onChange({ ...hsv, a: alpha });\n }\n };\n\n const handleHslChange = (key, val) => {\n const newValue = { ...localValue, [key]: val };\n setLocalValue(newValue);\n const h = parseInt(newValue.h, 10);\n const s = parseInt(newValue.s, 10);\n const l = parseInt(newValue.l, 10);\n if (!isNaN(h) && !isNaN(s) && !isNaN(l)) {\n const rgb = hslToRgb(\n Math.min(360, Math.max(0, h)),\n Math.min(100, Math.max(0, s)) / 100,\n Math.min(100, Math.max(0, l)) / 100\n );\n const hsv = rgbToHsv(rgb.r, rgb.g, rgb.b);\n onChange({ ...hsv, a: alpha });\n }\n };\n\n return (\n <div className=\"color-input-container\">\n <div\n className=\"mode-selector\"\n ref={dropdownRef}\n onClick={() => setShowDropdown(!showDropdown)}\n >\n <span>{mode.charAt(0) + mode.slice(1).toLowerCase()}</span>\n <span\n className=\"arrow\"\n style={{\n fontSize: \"10px\",\n marginLeft: \"4px\",\n transform: showDropdown ? \"rotate(180deg)\" : \"rotate(0deg)\",\n display: \"inline-block\",\n transition: \"transform 0.2s\",\n color: \"#8c8c8c\",\n }}\n >\n <svg\n viewBox=\"0 0 1024 1024\"\n width=\"10\"\n height=\"10\"\n fill=\"currentColor\"\n >\n <path d=\"M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3 0.1-12.7-6.4-12.7z\" />\n </svg>\n </span>\n {showDropdown && (\n <div className=\"mode-dropdown\">\n <div\n className=\"mode-option\"\n onClick={(e) => {\n e.stopPropagation();\n setMode(\"HEX\");\n setShowDropdown(false);\n }}\n >\n Hex\n </div>\n <div\n className=\"mode-option\"\n onClick={(e) => {\n e.stopPropagation();\n setMode(\"RGB\");\n setShowDropdown(false);\n }}\n >\n RGB\n </div>\n <div\n className=\"mode-option\"\n onClick={(e) => {\n e.stopPropagation();\n setMode(\"HSL\");\n setShowDropdown(false);\n }}\n >\n HSL\n </div>\n </div>\n )}\n </div>\n\n <div className=\"color-input-fields\">\n {mode === \"HEX\" && (\n <div className=\"hex-input-wrapper\">\n <span className=\"hex-prefix\">#</span>\n <input\n className=\"color-input hex\"\n value={localValue.hex ? localValue.hex.replace(\"#\", \"\") : \"\"}\n onChange={handleHexChange}\n />\n </div>\n )}\n {mode === \"RGB\" && (\n <>\n <input\n className=\"color-input\"\n type=\"number\"\n placeholder=\"R\"\n value={localValue.r !== undefined ? localValue.r : \"\"}\n onChange={(e) => handleRgbChange(\"r\", e.target.value)}\n />\n <input\n className=\"color-input\"\n type=\"number\"\n placeholder=\"G\"\n value={localValue.g !== undefined ? localValue.g : \"\"}\n onChange={(e) => handleRgbChange(\"g\", e.target.value)}\n />\n <input\n className=\"color-input\"\n type=\"number\"\n placeholder=\"B\"\n value={localValue.b !== undefined ? localValue.b : \"\"}\n onChange={(e) => handleRgbChange(\"b\", e.target.value)}\n />\n </>\n )}\n {mode === \"HSL\" && (\n <>\n <input\n className=\"color-input\"\n type=\"number\"\n placeholder=\"H\"\n value={localValue.h !== undefined ? localValue.h : \"\"}\n onChange={(e) => handleHslChange(\"h\", e.target.value)}\n />\n <input\n className=\"color-input\"\n type=\"number\"\n placeholder=\"S\"\n value={localValue.s !== undefined ? localValue.s : \"\"}\n onChange={(e) => handleHslChange(\"s\", e.target.value)}\n />\n <input\n className=\"color-input\"\n type=\"number\"\n placeholder=\"L\"\n value={localValue.l !== undefined ? localValue.l : \"\"}\n onChange={(e) => handleHslChange(\"l\", e.target.value)}\n />\n </>\n )}\n <div className=\"color-input alpha-display\">\n {Math.round(alpha * 100)}%\n </div>\n </div>\n </div>\n );\n};\n\nexport default ColorInput;\n","import React, { useState, useRef, useEffect, useLayoutEffect } from \"react\";\nimport ReactDOM from \"react-dom\";\nimport ColorBoard from \"./ColorBoard\";\nimport { HueSlider, AlphaSlider } from \"./Sliders\";\nimport ColorInput from \"./ColorInput\";\nimport {\n hsvToRgb,\n rgbToHex,\n parseColor,\n hexToRgb,\n rgbToHsv,\n} from \"./utils/color\";\nimport \"./index.css\";\n\nconst DEFAULT_PRESETS = [\n \"#E0B5AE\",\n \"#B2BBDE\",\n \"#F2DDB3\",\n \"#E0E5C5\",\n \"#BBD0C3\",\n \"#B5D1E3\",\n \"#FFFFFF\",\n \"#D25536\",\n \"#EFA154\",\n \"#F7DA7E\",\n \"#5FA67F\",\n \"#A2829D\",\n \"#D390A2\",\n \"#000000\",\n \"#0099A4\",\n \"#EABA00\",\n \"#C9462C\",\n \"#3171AC\",\n \"#783780\",\n \"#1E80EA\",\n \"#2AAC3B\",\n \"#B63455\",\n \"#81532F\",\n \"#AA9A5C\",\n \"#828281\",\n \"#055753\",\n \"#8F262B\",\n \"#F0D8D0\",\n];\n\nconst ColorPicker = ({\n value,\n defaultValue,\n onChange,\n showLabel = true,\n label = \"Color\",\n showArrow = true,\n showInput = true,\n showColorBoard = true,\n presets: customPresets,\n tooltipText = \"Color Picker\",\n screenPickerTooltip = \"屏幕取色\",\n recommendedTitle = \"Recommended\",\n recentTitle = \"Recent\",\n moreText = \"More\",\n lessText = \"Less\",\n}) => {\n const [isOpen, setIsOpen] = useState(false);\n const [isExpanded, setIsExpanded] = useState(false);\n const [recentColors, setRecentColors] = useState([]);\n const presets = customPresets || DEFAULT_PRESETS;\n\n const [color, setColor] = useState(() => {\n const initColor = value || defaultValue || \"#1677ff\";\n return parseColor(initColor);\n });\n\n const [inputValue, setInputValue] = useState(() => {\n const rgb = hsvToRgb(color.h, color.s, color.v);\n return rgbToHex(rgb.r, rgb.g, rgb.b).toUpperCase();\n });\n\n const containerRef = useRef(null);\n const triggerRef = useRef(null);\n const panelRef = useRef(null);\n const [panelStyle, setPanelStyle] = useState({});\n\n useEffect(() => {\n if (value !== undefined) {\n const newColor = parseColor(value);\n setColor(newColor);\n const rgb = hsvToRgb(newColor.h, newColor.s, newColor.v);\n setInputValue(rgbToHex(rgb.r, rgb.g, rgb.b).toUpperCase());\n }\n }, [value]);\n\n const handleChange = (newColor) => {\n const nextColor = { ...color, ...newColor };\n setColor(nextColor);\n\n const rgb = hsvToRgb(nextColor.h, nextColor.s, nextColor.v);\n const hex = rgbToHex(rgb.r, rgb.g, rgb.b).toUpperCase();\n setInputValue(hex);\n\n if (onChange) {\n onChange(hex, { ...rgb, a: nextColor.a });\n }\n };\n\n const handleInputChange = (e) => {\n const val = e.target.value;\n setInputValue(val);\n\n if (/^#?([0-9A-F]{3}|[0-9A-F]{6})$/i.test(val)) {\n const rgb = hexToRgb(val);\n if (rgb) {\n const hsv = rgbToHsv(rgb.r, rgb.g, rgb.b);\n handleChange({ ...hsv, a: color.a });\n }\n }\n };\n\n useLayoutEffect(() => {\n if (\n !isOpen ||\n !triggerRef.current ||\n !panelRef.current ||\n typeof window === \"undefined\"\n ) {\n return;\n }\n\n const triggerRect = triggerRef.current.getBoundingClientRect();\n const panelRect = panelRef.current.getBoundingClientRect();\n const viewportHeight = window.innerHeight;\n const viewportWidth = window.innerWidth;\n\n let top = triggerRect.bottom + window.scrollY + 4;\n let left = triggerRect.left + window.scrollX;\n\n // 垂直方向边界检测\n if (triggerRect.bottom + panelRect.height + 4 > viewportHeight) {\n // 如果下方空间不足，且上方空间足够，则显示在上方\n if (triggerRect.top > panelRect.height + 4) {\n top = triggerRect.top + window.scrollY - panelRect.height - 4;\n }\n }\n\n // 水平方向边界检测\n if (triggerRect.left + panelRect.width > viewportWidth) {\n left = viewportWidth - panelRect.width - 10;\n }\n if (left < 0) left = 0;\n\n setPanelStyle({\n position: \"absolute\",\n top,\n left,\n zIndex: 9999,\n });\n }, [isOpen, isExpanded, recentColors.length]);\n\n const handleEyeDropper = async () => {\n if (!window.EyeDropper) {\n alert(\"当前浏览器不支持屏幕取色功能\");\n return;\n }\n\n try {\n const eyeDropper = new window.EyeDropper();\n const result = await eyeDropper.open();\n const { sRGBHex } = result;\n const rgb = hexToRgb(sRGBHex);\n if (rgb) {\n const hsv = rgbToHsv(rgb.r, rgb.g, rgb.b);\n handleChange({ ...hsv, a: 1 });\n }\n } catch (e) {\n // 用户取消取色或发生错误\n console.log(\"EyeDropper failed or canceled:\", e);\n }\n };\n\n useEffect(() => {\n const handleClickOutside = (event) => {\n const containerEl = containerRef.current;\n const panelEl = panelRef.current;\n\n const isInContainer = containerEl && containerEl.contains(event.target);\n const isInPanel = panelEl && panelEl.contains(event.target);\n\n if (!isInContainer && !isInPanel) {\n setIsOpen(false);\n }\n };\n\n if (isOpen) {\n document.addEventListener(\"mousedown\", handleClickOutside);\n } else {\n const rgb = hsvToRgb(color.h, color.s, color.v);\n const currentHex = rgbToHex(rgb.r, rgb.g, rgb.b).toUpperCase();\n setRecentColors((prev) => {\n if (prev.includes(currentHex)) return prev;\n return [currentHex, ...prev].slice(0, 10);\n });\n }\n\n return () => {\n document.removeEventListener(\"mousedown\", handleClickOutside);\n };\n }, [isOpen, color]);\n\n const rgb = hsvToRgb(color.h, color.s, color.v);\n const displayColor = `rgba(${rgb.r}, ${rgb.g}, ${rgb.b}, ${color.a})`;\n const initialLimit = 14;\n const visiblePresets = isExpanded ? presets : presets.slice(0, initialLimit);\n const showExpand = presets.length > initialLimit;\n\n const panel = isOpen ? (\n <div className=\"color-picker-panel\" style={panelStyle} ref={panelRef}>\n {showColorBoard && (\n <div\n className=\"color-picker-board-wrapper\"\n style={{\n marginTop: \"10px\",\n borderTop: \"1px solid #eee\",\n }}\n >\n <ColorBoard\n hue={color.h}\n saturation={color.s}\n value={color.v}\n onChange={(s, v) => handleChange({ s, v })}\n onComplete={() => setIsOpen(false)}\n />\n <HueSlider hue={color.h} onChange={(h) => handleChange({ h })} />\n {/* <AlphaSlider\n alpha={color.a}\n color={rgb}\n onChange={(a) => handleChange({ a })}\n /> */}\n <ColorInput\n hue={color.h}\n saturation={color.s}\n value={color.v}\n alpha={color.a}\n onChange={(newHsv) => handleChange(newHsv)}\n />\n </div>\n )}\n <div className=\"color-picker-presets\">\n <div className=\"palette-section-title\" style={{ marginTop: 8 }}>\n <span>{recommendedTitle}</span>\n <span\n className=\"color-picker-icon-right\"\n onClick={handleEyeDropper}\n title={screenPickerTooltip}\n >\n <svg\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <defs>\n <rect id=\"path-1\" x=\"0\" y=\"0\" width=\"16\" height=\"16\" />\n </defs>\n <g stroke=\"none\" strokeWidth=\"1\" fill=\"none\" fillRule=\"evenodd\">\n <g transform=\"translate(-920.000000, -594.000000)\">\n <g transform=\"translate(720.000000, 418.000000)\">\n <g transform=\"translate(200.000000, 176.000000)\">\n <mask id=\"mask-2\" fill=\"white\">\n <use xlinkHref=\"#path-1\" />\n </mask>\n <g />\n <g\n mask=\"url(#mask-2)\"\n fill=\"#000000\"\n fillOpacity=\"0.85\"\n fillRule=\"nonzero\"\n >\n <g transform=\"translate(8.106532, 8.106532) rotate(-315.000000) translate(-8.106532, -8.106532) translate(-0.266667, -0.266667)\">\n <path\n d=\"M5.67238576,2.96585378 L6.99478644,4.28811977 L7.03978941,4.24867364 C7.66833128,3.72977631 8.60030981,3.76436946 9.18839345,4.3524531 L9.94264069,5.10670034 C10.1509203,5.31497996 10.1509203,5.65266795 9.94264069,5.86094757 L9.18778644,6.61411977 L13.7138769,11.1406782 C14.4428555,11.8696569 14.4428555,13.0515648 13.7138769,13.7805435 C12.9848982,14.5095222 11.8029902,14.5095222 11.0740115,13.7805435 L6.54778644,9.25411977 L5.7942809,10.0093074 C5.58600128,10.217587 5.24831329,10.217587 5.04003367,10.0093074 L4.28578644,9.25506012 C3.66094757,8.63022125 3.66094757,7.61715729 4.28578644,6.99231842 L4.35178644,6.92511977 L3.03252045,5.6057191 C2.30354177,4.87674042 2.30354177,3.69483246 3.03252045,2.96585378 C3.76149912,2.2368751 4.94340708,2.2368751 5.67238576,2.96585378 Z M8.43414622,7.36944204 L7.86778644,7.93411977 L7.30277537,8.50081289 L11.8282588,13.0262963 C12.1295204,13.3275579 12.6112769,13.3383172 12.925431,13.0585743 L12.9596296,13.0262963 C13.2720491,12.7138769 13.2720491,12.2073449 12.9596296,11.8949254 L8.43414622,7.36944204 Z M7.70907857,5.07958956 L7.67989899,5.10670034 L5.04003367,7.74656565 C4.83175405,7.95484528 4.83175405,8.29253326 5.04003367,8.50081289 L5.41715729,8.8779365 L8.81126984,5.48382395 L8.43414622,5.10670034 C8.23533385,4.90788797 7.91861014,4.89885105 7.70907857,5.07958956 Z M3.82096628,3.68782298 L3.78676768,3.72010101 C3.47434825,4.03252045 3.47434825,4.53905243 3.78676768,4.85147186 L5.10670034,6.17140452 L6.23807119,5.04003367 L4.91813853,3.72010101 C4.61687693,3.41883942 4.13512038,3.40808007 3.82096628,3.68782298 Z\"\n transform=\"translate(8.373199, 8.373199) rotate(-315.000000) translate(-8.373199, -8.373199)\"\n />\n </g>\n </g>\n </g>\n </g>\n </g>\n </g>\n </svg>\n </span>\n </div>\n <div className={`presets-grid modern`}>\n {presets.map((preset, idx) => (\n <div\n key={idx}\n className=\"preset-item preset-item-inner\"\n style={{ backgroundColor: preset }}\n onClick={() => {\n const rgbValue = hexToRgb(preset);\n if (rgbValue) {\n const hsv = rgbToHsv(rgbValue.r, rgbValue.g, rgbValue.b);\n handleChange({ ...hsv, a: 1 });\n setIsOpen(false);\n }\n }}\n title={preset}\n />\n ))}\n </div>\n {/* {showExpand && (\n <div\n className=\"presets-collapse\"\n onClick={() => setIsExpanded(!isExpanded)}\n >\n {isExpanded ? lessText : moreText}\n <span className={`collapse-arrow ${isExpanded ? \"expanded\" : \"\"}`}>\n ▼\n </span>\n </div>\n )} */}\n\n {recentColors.length > 0 && (\n <>\n <div className=\"palette-section-title\">{recentTitle}</div>\n <div className=\"presets-grid recent\">\n {recentColors.map((recentColor, idx) => (\n <div\n key={idx}\n className=\"preset-item\"\n style={{ backgroundColor: recentColor }}\n onClick={() => {\n const rgbValue = hexToRgb(recentColor);\n if (rgbValue) {\n const hsv = rgbToHsv(rgbValue.r, rgbValue.g, rgbValue.b);\n handleChange({ ...hsv, a: 1 });\n setIsOpen(false);\n }\n }}\n title={recentColor}\n />\n ))}\n </div>\n </>\n )}\n </div>\n </div>\n ) : null;\n\n return (\n <div className=\"color-picker-container\" ref={containerRef}>\n <div className=\"color-picker-main-row\">\n <div className=\"color-picker-tooltip-trigger\">\n {showLabel && <span className=\"color-picker-label\">{label}</span>}\n\n <div\n className={`color-picker-trigger ${isOpen ? \"is-open\" : \"\"}`}\n onClick={() => setIsOpen(!isOpen)}\n ref={triggerRef}\n >\n <div\n className=\"color-block\"\n style={{ backgroundColor: displayColor }}\n />\n {showArrow && (\n <span className={`color-picker-arrow ${isOpen ? \"open\" : \"\"}`}>\n <svg\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <g\n stroke=\"none\"\n strokeWidth=\"1\"\n fill=\"none\"\n fillRule=\"evenodd\"\n >\n <g\n transform=\"translate(-1348.000000, -88.000000)\"\n fillRule=\"nonzero\"\n >\n <g transform=\"translate(0.000000, 60.000000)\">\n <g transform=\"translate(584.000000, 20.000000)\">\n <g transform=\"translate(728.000000, 4.000000)\">\n <g transform=\"translate(44.000000, 12.000000) rotate(-360.000000) translate(-44.000000, -12.000000) translate(36.000000, 4.000000)\">\n <rect\n fill=\"#000000\"\n opacity=\"0\"\n x=\"0\"\n y=\"0\"\n width=\"16\"\n height=\"16\"\n />\n <path\n d=\"M13.0750341,5.34788541 C12.9440655,5.21691678 12.7257845,5.21691678 12.5948158,5.34788541 L8.01091405,9.93178717 L3.40518417,5.34788541 C3.27421555,5.21691678 3.05593452,5.21691678 2.92496589,5.34788541 C2.79399727,5.47885403 2.79399727,5.69713506 2.92496589,5.82810369 L7.77080491,10.6521146 C7.90177353,10.7830832 8.12005456,10.7830832 8.25102319,10.6521146 L13.0750341,5.82810369 C13.2060027,5.69713506 13.2060027,5.47885403 13.0750341,5.34788541 Z\"\n stroke=\"#FFFFFF\"\n />\n </g>\n </g>\n </g>\n </g>\n </g>\n </g>\n </svg>\n </span>\n )}\n <span className=\"tooltip-text\">{tooltipText}</span>\n </div>\n </div>\n\n {showInput && (\n <div className=\"color-picker-input-wrapper\">\n <input\n type=\"text\"\n value={inputValue}\n onChange={handleInputChange}\n placeholder=\"Please input color\"\n />\n {inputValue && (\n <span\n className=\"input-clear-icon\"\n onClick={() => setInputValue(\"\")}\n >\n <img\n src=\"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAA8klEQVQ4T51SwVHDQAzcdQOETugAqISkg/Cw9CRf2Q+gAkwlJB1QimnAYnRz57m55AG5l2+9K632RFw44zg+ALiPX+5+FJFTS2MNmNme5AuATUOcARxE5L3gq9DMJpJPlxxU2CQiu7gnYe70mq19tgXcfcXc/VlV34pwJnkTBFXdDsOwBfCRO+1EZKoczSJyywjC3b8qO4mYxai+SyGQfKSZHXIg9XhJHEDTPXHC7vXCq63mVP8cjrv/qOrm7DkAxGyRan1qLM3/rwUoz7UuQCkdixCrFW9atwt7JPcl6TNhIUdgy7Lcxb3ruu++74/tKv4CNXed5xhXezYAAAAASUVORK5CYII=\"\n alt=\"\"\n width=\"12\"\n height=\"12\"\n />\n </span>\n )}\n </div>\n )}\n </div>\n\n {typeof document !== \"undefined\" &&\n ReactDOM.createPortal(panel, document.body)}\n\n <div>\n <div className={`presets-grid modern`}>\n {visiblePresets.map((preset, idx) => (\n <div\n key={idx}\n className=\"preset-item\"\n style={{ backgroundColor: preset }}\n onClick={() => {\n const rgb = hexToRgb(preset);\n if (rgb) {\n const hsv = rgbToHsv(rgb.r, rgb.g, rgb.b);\n handleChange({ ...hsv, a: 1 });\n }\n }}\n title={preset}\n />\n ))}\n </div>\n {showExpand && (\n <div\n className=\"presets-collapse\"\n onClick={() => setIsExpanded(!isExpanded)}\n >\n {isExpanded ? lessText : moreText}\n <span className={`collapse-arrow ${isExpanded ? \"expanded\" : \"\"}`}>\n ▼\n </span>\n </div>\n )}\n </div>\n </div>\n );\n};\n\nexport default ColorPicker;\n"],"names":["clamp","value","min","max","Math","hsvToRgb","h","s","v","r","g","b","i","floor","f","p","q","t","round","rgbToHsv","d","rgbToHex","toHex","c","hex","toString","length","hexToRgb","replace","m","result","exec","parseInt","parseColor","color","a","startsWith","rgb","rgbaMatch","match","undefined","parseFloat","ColorBoard","hue","saturation","onChange","onComplete","containerRef","useRef","isDragging","setIsDragging","useState","handleChange","useCallback","e","current","width","height","left","top","getBoundingClientRect","x","clientX","y","clientY","handleMouseUp","useEffect","handleMouseMove","window","addEventListener","removeEventListener","React","createElement","ref","className","style","backgroundColor","onMouseDown","Slider","_ref","children","HueSlider","_ref2","ColorInput","alpha","mode","setMode","localValue","setLocalValue","showDropdown","setShowDropdown","dropdownRef","handleClickOutside","event","contains","target","document","getRgb","hsl","l","rgbToHsl","handleRgbChange","key","val","newValue","isNaN","hsv","handleHslChange","hue2rgb","hslToRgb","onClick","charAt","slice","toLowerCase","fontSize","marginLeft","transform","display","transition","viewBox","fill","stopPropagation","test","Fragment","type","placeholder","DEFAULT_PRESETS","defaultValue","showLabel","label","showArrow","showInput","showColorBoard","presets","customPresets","tooltipText","screenPickerTooltip","recommendedTitle","recentTitle","moreText","lessText","isOpen","setIsOpen","isExpanded","setIsExpanded","recentColors","setRecentColors","setColor","inputValue","setInputValue","toUpperCase","triggerRef","panelRef","panelStyle","setPanelStyle","newColor","nextColor","_extends","useLayoutEffect","triggerRect","panelRect","viewportHeight","innerHeight","viewportWidth","innerWidth","bottom","scrollY","scrollX","position","zIndex","containerEl","panelEl","isInContainer","isInPanel","currentHex","prev","includes","displayColor","visiblePresets","showExpand","panel","marginTop","borderTop","newHsv","handleEyeDropper","EyeDropper","alert","Promise","resolve","_temp","body","recover","eyeDropper","open","then","sRGBHex","_catch","console","log","reject","title","xmlns","id","stroke","strokeWidth","fillRule","xlinkHref","mask","fillOpacity","map","preset","idx","rgbValue","recentColor","opacity","src","alt","ReactDOM","createPortal"],"mappings":"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"}
package/dist/index.modern.mjs CHANGED
@@ -1,2 +1,2 @@
1
- import e,{useRef as t,useState as a,useCallback as n,useEffect as r}from"react";import l from"react-dom";function o(){return o=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var a=arguments[t];for(var n in a)({}).hasOwnProperty.call(a,n)&&(e[n]=a[n])}return e},o.apply(null,arguments)}function s(e,t,a){return Math.min(Math.max(e,t),a)}function c(e,t,a){let n,r,l;e=(e%360+360)%360;let o=Math.floor(e/60),s=e/60-o,c=a*(1-t),i=a*(1-s*t),m=a*(1-(1-s)*t);switch(o%6){case 0:n=a,r=m,l=c;break;case 1:n=i,r=a,l=c;break;case 2:n=c,r=a,l=m;break;case 3:n=c,r=i,l=a;break;case 4:n=m,r=c,l=a;break;case 5:n=a,r=c,l=i;break;default:n=0,r=0,l=0}return{r:Math.round(255*n),g:Math.round(255*r),b:Math.round(255*l)}}function i(e,t,a){e/=255,t/=255,a/=255;let n,r,l=Math.max(e,t,a),o=Math.min(e,t,a),s=l,c=l-o;if(r=0===l?0:c/l,l===o)n=0;else{switch(l){case e:n=(t-a)/c+(t<a?6:0);break;case t:n=(a-e)/c+2;break;case a:n=(e-t)/c+4;break;default:n=0}n/=6}return{h:360*n,s:r,v:s}}function m(e,t,a){const n=e=>{const t=Math.round(e).toString(16);return 1===t.length?"0"+t:t};return"#"+n(e)+n(t)+n(a)}function d(e){e=e.replace(/^#?([a-f\d])([a-f\d])([a-f\d])$/i,function(e,t,a,n){return t+t+a+a+n+n});const t=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(e);return t?{r:parseInt(t[1],16),g:parseInt(t[2],16),b:parseInt(t[3],16)}:null}function u(e){if(!e)return{h:0,s:1,v:1,a:1};if(e.startsWith("#")){const t=d(e);if(t)return o({},i(t.r,t.g,t.b),{a:1})}const t=e.match(/^rgba?\((\d+),\s*(\d+),\s*(\d+)(?:,\s*([\d.]+))?\)$/);if(t){const e=parseInt(t[1],10),a=parseInt(t[2],10),n=parseInt(t[3],10),r=void 0!==t[4]?parseFloat(t[4]):1;return o({},i(e,a,n),{a:r})}return{h:0,s:1,v:1,a:1}}const p=({hue:l,saturation:o,value:c,onChange:i})=>{const m=t(null),[d,u]=a(!1),p=n(e=>{if(!m.current)return;const{width:t,height:a,left:n,top:r}=m.current.getBoundingClientRect(),l=s(e.clientX-n,0,t),o=s(e.clientY-r,0,a);i(l/t,1-o/a)},[i]),h=n(()=>{u(!1)},[]);return r(()=>{const e=e=>{d&&p(e)};return d&&(window.addEventListener("mousemove",e),window.addEventListener("mouseup",h)),()=>{window.removeEventListener("mousemove",e),window.removeEventListener("mouseup",h)}},[d,p,h]),/*#__PURE__*/e.createElement("div",{ref:m,className:"color-board",style:{backgroundColor:`hsl(${l}, 100%, 50%)`},onMouseDown:e=>{u(!0),p(e)}},/*#__PURE__*/e.createElement("div",{className:"color-board-white"}),/*#__PURE__*/e.createElement("div",{className:"color-board-black"}),/*#__PURE__*/e.createElement("div",{className:"color-board-handler",style:{left:100*o+"%",top:100*(1-c)+"%"}}))},h=({value:l,max:o,onChange:c,className:i,style:m,children:d})=>{const u=t(null),[p,h]=a(!1),g=n(e=>{if(!u.current)return;const{width:t,left:a}=u.current.getBoundingClientRect(),n=s(e.clientX-a,0,t);c(n/t*o)},[o,c]),E=n(()=>{h(!1)},[]);return r(()=>{const e=e=>{p&&g(e)};return p&&(window.addEventListener("mousemove",e),window.addEventListener("mouseup",E)),()=>{window.removeEventListener("mousemove",e),window.removeEventListener("mouseup",E)}},[p,g,E]),/*#__PURE__*/e.createElement("div",{ref:u,className:`color-slider ${i||""}`,style:m,onMouseDown:e=>{h(!0),g(e)}},/*#__PURE__*/e.createElement("div",{className:"color-slider-handler",style:{left:l/o*100+"%"}}),d)},g=({hue:t,onChange:a})=>/*#__PURE__*/e.createElement(h,{value:t,max:360,onChange:a,className:"hue-slider"}),E=({alpha:t,color:a,onChange:n})=>{const{r,g:l,b:o}=a;/*#__PURE__*/return e.createElement(h,{value:t,max:1,onChange:n,className:"alpha-slider-bg",style:{background:`linear-gradient(to right, rgba(${r},${l},${o},0) 0%, rgba(${r},${l},${o},1) 100%)`}})},v=({hue:l,saturation:s,value:u,alpha:p,onChange:h})=>{const[g,E]=a("HEX"),[v,f]=a({}),[C,w]=a(!1),b=t(null);r(()=>{const e=e=>{b.current&&!b.current.contains(e.target)&&w(!1)};return document.addEventListener("mousedown",e),()=>{document.removeEventListener("mousedown",e)}},[]);const N=n(()=>c(l,s,u),[l,s,u]);r(()=>{const e=N();if("HEX"===g)f({hex:m(e.r,e.g,e.b)});else if("RGB"===g)f({r:e.r,g:e.g,b:e.b});else if("HSL"===g){const t=function(e,t,a){e/=255,t/=255,a/=255;let n,r,l=Math.max(e,t,a),o=Math.min(e,t,a),s=(l+o)/2;if(l===o)n=r=0;else{let c=l-o;switch(r=s>.5?c/(2-l-o):c/(l+o),l){case e:n=(t-a)/c+(t<a?6:0);break;case t:n=(a-e)/c+2;break;case a:n=(e-t)/c+4;break;default:n=0}n/=6}return{h:360*n,s:r,l:s}}(e.r,e.g,e.b);f({h:Math.round(t.h),s:Math.round(100*t.s),l:Math.round(100*t.l)})}},[l,s,u,g,N]);const k=(e,t)=>{const a=o({},v,{[e]:t});f(a);const n=parseInt(a.r,10),r=parseInt(a.g,10),l=parseInt(a.b,10);if(!isNaN(n)&&!isNaN(r)&&!isNaN(l)){const e=i(Math.min(255,Math.max(0,n)),Math.min(255,Math.max(0,r)),Math.min(255,Math.max(0,l)));h(o({},e,{a:p}))}},A=(e,t)=>{const a=o({},v,{[e]:t});f(a);const n=parseInt(a.h,10),r=parseInt(a.s,10),l=parseInt(a.l,10);if(!isNaN(n)&&!isNaN(r)&&!isNaN(l)){const e=function(e,t,a){let n,r,l;if(0===t)n=r=l=a;else{const o=(e,t,a)=>(a<0&&(a+=1),a>1&&(a-=1),a<1/6?e+6*(t-e)*a:a<.5?t:a<2/3?e+(t-e)*(2/3-a)*6:e),s=a<.5?a*(1+t):a+t-a*t,c=2*a-s;n=o(c,s,(e/=360)+1/3),r=o(c,s,e),l=o(c,s,e-1/3)}return{r:Math.round(255*n),g:Math.round(255*r),b:Math.round(255*l)}}(Math.min(360,Math.max(0,n)),Math.min(100,Math.max(0,r))/100,Math.min(100,Math.max(0,l))/100),t=i(e.r,e.g,e.b);h(o({},t,{a:p}))}};/*#__PURE__*/return e.createElement("div",{className:"color-input-container"},/*#__PURE__*/e.createElement("div",{className:"mode-selector",ref:b,onClick:()=>w(!C)},/*#__PURE__*/e.createElement("span",null,g.charAt(0)+g.slice(1).toLowerCase()),/*#__PURE__*/e.createElement("span",{className:"arrow",style:{fontSize:"10px",marginLeft:"4px",transform:C?"rotate(180deg)":"rotate(0deg)",display:"inline-block",transition:"transform 0.2s",color:"#8c8c8c"}},/*#__PURE__*/e.createElement("svg",{viewBox:"0 0 1024 1024",width:"10",height:"10",fill:"currentColor"},/*#__PURE__*/e.createElement("path",{d:"M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3 0.1-12.7-6.4-12.7z"}))),C&&/*#__PURE__*/e.createElement("div",{className:"mode-dropdown"},/*#__PURE__*/e.createElement("div",{className:"mode-option",onClick:e=>{e.stopPropagation(),E("HEX"),w(!1)}},"Hex"),/*#__PURE__*/e.createElement("div",{className:"mode-option",onClick:e=>{e.stopPropagation(),E("RGB"),w(!1)}},"RGB"),/*#__PURE__*/e.createElement("div",{className:"mode-option",onClick:e=>{e.stopPropagation(),E("HSL"),w(!1)}},"HSL"))),/*#__PURE__*/e.createElement("div",{className:"color-input-fields"},"HEX"===g&&/*#__PURE__*/e.createElement("div",{className:"hex-input-wrapper"},/*#__PURE__*/e.createElement("span",{className:"hex-prefix"},"#"),/*#__PURE__*/e.createElement("input",{className:"color-input hex",value:v.hex?v.hex.replace("#",""):"",onChange:e=>{const t=e.target.value;if(f(o({},v,{hex:t})),/^#?([0-9A-F]{3}|[0-9A-F]{6})$/i.test(t)){const e=d(t);if(e){const t=i(e.r,e.g,e.b);h(o({},t,{a:p}))}}}})),"RGB"===g&&/*#__PURE__*/e.createElement(e.Fragment,null,/*#__PURE__*/e.createElement("input",{className:"color-input",type:"number",placeholder:"R",value:void 0!==v.r?v.r:"",onChange:e=>k("r",e.target.value)}),/*#__PURE__*/e.createElement("input",{className:"color-input",type:"number",placeholder:"G",value:void 0!==v.g?v.g:"",onChange:e=>k("g",e.target.value)}),/*#__PURE__*/e.createElement("input",{className:"color-input",type:"number",placeholder:"B",value:void 0!==v.b?v.b:"",onChange:e=>k("b",e.target.value)})),"HSL"===g&&/*#__PURE__*/e.createElement(e.Fragment,null,/*#__PURE__*/e.createElement("input",{className:"color-input",type:"number",placeholder:"H",value:void 0!==v.h?v.h:"",onChange:e=>A("h",e.target.value)}),/*#__PURE__*/e.createElement("input",{className:"color-input",type:"number",placeholder:"S",value:void 0!==v.s?v.s:"",onChange:e=>A("s",e.target.value)}),/*#__PURE__*/e.createElement("input",{className:"color-input",type:"number",placeholder:"L",value:void 0!==v.l?v.l:"",onChange:e=>A("l",e.target.value)})),/*#__PURE__*/e.createElement("div",{className:"color-input alpha-display"},Math.round(100*p),"%")))},f=["#E0B5AE","#B2BBDE","#F2DDB3","#E0E5C5","#BBD0C3","#B5D1E3","#FFFFFF","#D25536","#EFA154","#F7DA7E","#5FA67F","#A2829D","#D390A2","#000000","#0099A4","#EABA00","#C9462C","#3171AC","#783780","#1E80EA","#2AAC3B","#B63455","#81532F","#AA9A5C","#828281","#055753","#8F262B","#F0D8D0"],C=({value:n,defaultValue:s,onChange:h,showLabel:C=!0,label:w="Color",showArrow:b=!0,showInput:N=!0,showColorBoard:k=!0,presets:A})=>{const[L,x]=a(!1),[y,M]=a(!1),[F,B]=a([]),R=A||f,[D,I]=a(()=>u(n||s||"#1677ff")),[X,$]=a(()=>{const e=c(D.h,D.s,D.v);return m(e.r,e.g,e.b).toUpperCase()}),H=t(null),S=t(null),[O,P]=a({});r(()=>{if(void 0!==n){const e=u(n);I(e);const t=c(e.h,e.s,e.v);$(m(t.r,t.g,t.b).toUpperCase())}},[n]);const U=e=>{const t=o({},D,e);I(t);const a=c(t.h,t.s,t.v),n=m(a.r,a.g,a.b).toUpperCase();$(n),h&&h(n,o({},a,{a:t.a}))};r(()=>{if(!L||!S.current||"undefined"==typeof window||"undefined"==typeof document)return;const e=S.current.getBoundingClientRect(),t=e.bottom+4+window.scrollY,a=e.left+window.scrollX;P({position:"absolute",top:t,left:a,zIndex:9999})},[L]),r(()=>{const e=e=>{H.current&&!H.current.contains(e.target)&&x(!1)};if(L)document.addEventListener("mousedown",e);else{const e=c(D.h,D.s,D.v),t=m(e.r,e.g,e.b).toUpperCase();B(e=>e.includes(t)?e:[t,...e].slice(0,10))}return()=>{document.removeEventListener("mousedown",e)}},[L,D]);const z=c(D.h,D.s,D.v),T=`rgba(${z.r}, ${z.g}, ${z.b}, ${D.a})`,G=y?R:R.slice(0,14),Q=R.length>14,J=L?/*#__PURE__*/e.createElement("div",{className:"color-picker-panel",style:O},k&&/*#__PURE__*/e.createElement("div",{className:"color-picker-board-wrapper",style:{marginTop:"10px",paddingTop:"10px",borderTop:"1px solid #eee"}},/*#__PURE__*/e.createElement(p,{hue:D.h,saturation:D.s,value:D.v,onChange:(e,t)=>U({s:e,v:t})}),/*#__PURE__*/e.createElement(g,{hue:D.h,onChange:e=>U({h:e})}),/*#__PURE__*/e.createElement(E,{alpha:D.a,color:z,onChange:e=>U({a:e})}),/*#__PURE__*/e.createElement(v,{hue:D.h,saturation:D.s,value:D.v,alpha:D.a,onChange:e=>U(e)})),/*#__PURE__*/e.createElement("div",{className:"color-picker-presets"},/*#__PURE__*/e.createElement("div",{className:"palette-section-title",style:{marginTop:8}},/*#__PURE__*/e.createElement("span",null,"Recommended"),/*#__PURE__*/e.createElement("span",{className:"color-picker-icon-right",onClick:async()=>{if(window.EyeDropper)try{const e=new window.EyeDropper,t=await e.open(),{sRGBHex:a}=t,n=d(a);if(n){const e=i(n.r,n.g,n.b);U(o({},e,{a:1}))}}catch(e){console.log("EyeDropper failed or canceled:",e)}else alert("当前浏览器不支持屏幕取色功能")},title:"屏幕取色"},/*#__PURE__*/e.createElement("svg",{width:"16",height:"16",viewBox:"0 0 16 16",xmlns:"http://www.w3.org/2000/svg"},/*#__PURE__*/e.createElement("defs",null,/*#__PURE__*/e.createElement("rect",{id:"path-1",x:"0",y:"0",width:"16",height:"16"})),/*#__PURE__*/e.createElement("g",{stroke:"none",strokeWidth:"1",fill:"none",fillRule:"evenodd"},/*#__PURE__*/e.createElement("g",{transform:"translate(-920.000000, -594.000000)"},/*#__PURE__*/e.createElement("g",{transform:"translate(720.000000, 418.000000)"},/*#__PURE__*/e.createElement("g",{transform:"translate(200.000000, 176.000000)"},/*#__PURE__*/e.createElement("mask",{id:"mask-2",fill:"white"},/*#__PURE__*/e.createElement("use",{xlinkHref:"#path-1"})),/*#__PURE__*/e.createElement("g",null),/*#__PURE__*/e.createElement("g",{mask:"url(#mask-2)",fill:"#000000",fillOpacity:"0.85",fillRule:"nonzero"},/*#__PURE__*/e.createElement("g",{transform:"translate(8.106532, 8.106532) rotate(-315.000000) translate(-8.106532, -8.106532) translate(-0.266667, -0.266667)"},/*#__PURE__*/e.createElement("path",{d:"M5.67238576,2.96585378 L6.99478644,4.28811977 L7.03978941,4.24867364 C7.66833128,3.72977631 8.60030981,3.76436946 9.18839345,4.3524531 L9.94264069,5.10670034 C10.1509203,5.31497996 10.1509203,5.65266795 9.94264069,5.86094757 L9.18778644,6.61411977 L13.7138769,11.1406782 C14.4428555,11.8696569 14.4428555,13.0515648 13.7138769,13.7805435 C12.9848982,14.5095222 11.8029902,14.5095222 11.0740115,13.7805435 L6.54778644,9.25411977 L5.7942809,10.0093074 C5.58600128,10.217587 5.24831329,10.217587 5.04003367,10.0093074 L4.28578644,9.25506012 C3.66094757,8.63022125 3.66094757,7.61715729 4.28578644,6.99231842 L4.35178644,6.92511977 L3.03252045,5.6057191 C2.30354177,4.87674042 2.30354177,3.69483246 3.03252045,2.96585378 C3.76149912,2.2368751 4.94340708,2.2368751 5.67238576,2.96585378 Z M8.43414622,7.36944204 L7.86778644,7.93411977 L7.30277537,8.50081289 L11.8282588,13.0262963 C12.1295204,13.3275579 12.6112769,13.3383172 12.925431,13.0585743 L12.9596296,13.0262963 C13.2720491,12.7138769 13.2720491,12.2073449 12.9596296,11.8949254 L8.43414622,7.36944204 Z M7.70907857,5.07958956 L7.67989899,5.10670034 L5.04003367,7.74656565 C4.83175405,7.95484528 4.83175405,8.29253326 5.04003367,8.50081289 L5.41715729,8.8779365 L8.81126984,5.48382395 L8.43414622,5.10670034 C8.23533385,4.90788797 7.91861014,4.89885105 7.70907857,5.07958956 Z M3.82096628,3.68782298 L3.78676768,3.72010101 C3.47434825,4.03252045 3.47434825,4.53905243 3.78676768,4.85147186 L5.10670034,6.17140452 L6.23807119,5.04003367 L4.91813853,3.72010101 C4.61687693,3.41883942 4.13512038,3.40808007 3.82096628,3.68782298 Z",transform:"translate(8.373199, 8.373199) rotate(-315.000000) translate(-8.373199, -8.373199)"})))))))))),/*#__PURE__*/e.createElement("div",{className:"presets-grid modern"},R.map((t,a)=>/*#__PURE__*/e.createElement("div",{key:a,className:"preset-item preset-item-inner",style:{backgroundColor:t},onClick:()=>{const e=d(t);if(e){const t=i(e.r,e.g,e.b);U(o({},t,{a:1}))}},title:t}))),F.length>0&&/*#__PURE__*/e.createElement(e.Fragment,null,/*#__PURE__*/e.createElement("div",{className:"palette-section-title"},"Recent"),/*#__PURE__*/e.createElement("div",{className:"presets-grid recent"},F.map((t,a)=>/*#__PURE__*/e.createElement("div",{key:a,className:"preset-item",style:{backgroundColor:t},onClick:()=>{const e=d(t);if(e){const t=i(e.r,e.g,e.b);U(o({},t,{a:1}))}},title:t})))))):null;/*#__PURE__*/return e.createElement("div",{className:"color-picker-container",ref:H},/*#__PURE__*/e.createElement("div",{className:"color-picker-main-row"},/*#__PURE__*/e.createElement("div",{className:"color-picker-tooltip-trigger"},C&&/*#__PURE__*/e.createElement("span",{className:"color-picker-label"},w),/*#__PURE__*/e.createElement("div",{className:"color-picker-trigger "+(L?"is-open":""),onClick:()=>x(!L),ref:S},/*#__PURE__*/e.createElement("div",{className:"color-block",style:{backgroundColor:T}}),b&&/*#__PURE__*/e.createElement("span",{className:"color-picker-arrow "+(L?"open":"")},/*#__PURE__*/e.createElement("svg",{width:"16",height:"16",viewBox:"0 0 16 16",xmlns:"http://www.w3.org/2000/svg"},/*#__PURE__*/e.createElement("g",{stroke:"none",strokeWidth:"1",fill:"none",fillRule:"evenodd"},/*#__PURE__*/e.createElement("g",{transform:"translate(-1348.000000, -88.000000)",fillRule:"nonzero"},/*#__PURE__*/e.createElement("g",{transform:"translate(0.000000, 60.000000)"},/*#__PURE__*/e.createElement("g",{transform:"translate(584.000000, 20.000000)"},/*#__PURE__*/e.createElement("g",{transform:"translate(728.000000, 4.000000)"},/*#__PURE__*/e.createElement("g",{transform:"translate(44.000000, 12.000000) rotate(-360.000000) translate(-44.000000, -12.000000) translate(36.000000, 4.000000)"},/*#__PURE__*/e.createElement("rect",{fill:"#000000",opacity:"0",x:"0",y:"0",width:"16",height:"16"}),/*#__PURE__*/e.createElement("path",{d:"M13.0750341,5.34788541 C12.9440655,5.21691678 12.7257845,5.21691678 12.5948158,5.34788541 L8.01091405,9.93178717 L3.40518417,5.34788541 C3.27421555,5.21691678 3.05593452,5.21691678 2.92496589,5.34788541 C2.79399727,5.47885403 2.79399727,5.69713506 2.92496589,5.82810369 L7.77080491,10.6521146 C7.90177353,10.7830832 8.12005456,10.7830832 8.25102319,10.6521146 L13.0750341,5.82810369 C13.2060027,5.69713506 13.2060027,5.47885403 13.0750341,5.34788541 Z",stroke:"#FFFFFF"}))))))))),/*#__PURE__*/e.createElement("span",{className:"tooltip-text"},"Color Picker"))),N&&/*#__PURE__*/e.createElement("div",{className:"color-picker-input-wrapper"},/*#__PURE__*/e.createElement("input",{type:"text",value:X,onChange:e=>{const t=e.target.value;if($(t),/^#?([0-9A-F]{3}|[0-9A-F]{6})$/i.test(t)){const e=d(t);if(e){const t=i(e.r,e.g,e.b);U(o({},t,{a:D.a}))}}},placeholder:"Please input color"}),X&&/*#__PURE__*/e.createElement("span",{className:"input-clear-icon",onClick:()=>$("")},/*#__PURE__*/e.createElement("img",{src:"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAA8klEQVQ4T51SwVHDQAzcdQOETugAqISkg/Cw9CRf2Q+gAkwlJB1QimnAYnRz57m55AG5l2+9K632RFw44zg+ALiPX+5+FJFTS2MNmNme5AuATUOcARxE5L3gq9DMJpJPlxxU2CQiu7gnYe70mq19tgXcfcXc/VlV34pwJnkTBFXdDsOwBfCRO+1EZKoczSJyywjC3b8qO4mYxai+SyGQfKSZHXIg9XhJHEDTPXHC7vXCq63mVP8cjrv/qOrm7DkAxGyRan1qLM3/rwUoz7UuQCkdixCrFW9atwt7JPcl6TNhIUdgy7Lcxb3ruu++74/tKv4CNXed5xhXezYAAAAASUVORK5CYII=",alt:"",width:"12",height:"12"})))),"undefined"!=typeof document&&l.createPortal(J,document.body),/*#__PURE__*/e.createElement("div",null,/*#__PURE__*/e.createElement("div",{className:"presets-grid modern"},G.map((t,a)=>/*#__PURE__*/e.createElement("div",{key:a,className:"preset-item",style:{backgroundColor:t},onClick:()=>{const e=d(t);if(e){const t=i(e.r,e.g,e.b);U(o({},t,{a:1}))}},title:t}))),Q&&/*#__PURE__*/e.createElement("div",{className:"presets-collapse",onClick:()=>M(!y)},y?"Less":"More",/*#__PURE__*/e.createElement("span",{className:"collapse-arrow "+(y?"expanded":"")},"▼"))))};export{C as default};
1
+ import e,{useRef as t,useState as a,useCallback as n,useEffect as r,useLayoutEffect as l}from"react";import o from"react-dom";function s(){return s=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var a=arguments[t];for(var n in a)({}).hasOwnProperty.call(a,n)&&(e[n]=a[n])}return e},s.apply(null,arguments)}function c(e,t,a){return Math.min(Math.max(e,t),a)}function i(e,t,a){let n,r,l;e=(e%360+360)%360;let o=Math.floor(e/60),s=e/60-o,c=a*(1-t),i=a*(1-s*t),m=a*(1-(1-s)*t);switch(o%6){case 0:n=a,r=m,l=c;break;case 1:n=i,r=a,l=c;break;case 2:n=c,r=a,l=m;break;case 3:n=c,r=i,l=a;break;case 4:n=m,r=c,l=a;break;case 5:n=a,r=c,l=i;break;default:n=0,r=0,l=0}return{r:Math.round(255*n),g:Math.round(255*r),b:Math.round(255*l)}}function m(e,t,a){e/=255,t/=255,a/=255;let n,r,l=Math.max(e,t,a),o=Math.min(e,t,a),s=l,c=l-o;if(r=0===l?0:c/l,l===o)n=0;else{switch(l){case e:n=(t-a)/c+(t<a?6:0);break;case t:n=(a-e)/c+2;break;case a:n=(e-t)/c+4;break;default:n=0}n/=6}return{h:360*n,s:r,v:s}}function d(e,t,a){const n=e=>{const t=Math.round(e).toString(16);return 1===t.length?"0"+t:t};return"#"+n(e)+n(t)+n(a)}function u(e){e=e.replace(/^#?([a-f\d])([a-f\d])([a-f\d])$/i,function(e,t,a,n){return t+t+a+a+n+n});const t=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(e);return t?{r:parseInt(t[1],16),g:parseInt(t[2],16),b:parseInt(t[3],16)}:null}function p(e){if(!e)return{h:0,s:1,v:1,a:1};if(e.startsWith("#")){const t=u(e);if(t)return s({},m(t.r,t.g,t.b),{a:1})}const t=e.match(/^rgba?\((\d+),\s*(\d+),\s*(\d+)(?:,\s*([\d.]+))?\)$/);if(t){const e=parseInt(t[1],10),a=parseInt(t[2],10),n=parseInt(t[3],10),r=void 0!==t[4]?parseFloat(t[4]):1;return s({},m(e,a,n),{a:r})}return{h:0,s:1,v:1,a:1}}const h=({hue:l,saturation:o,value:s,onChange:i,onComplete:m})=>{const d=t(null),[u,p]=a(!1),h=n(e=>{if(!d.current)return;const{width:t,height:a,left:n,top:r}=d.current.getBoundingClientRect(),l=c(e.clientX-n,0,t),o=c(e.clientY-r,0,a);i(l/t,1-o/a)},[i]),g=n(()=>{p(!1),m&&m()},[m]);return r(()=>{const e=e=>{u&&h(e)};return u&&(window.addEventListener("mousemove",e),window.addEventListener("mouseup",g)),()=>{window.removeEventListener("mousemove",e),window.removeEventListener("mouseup",g)}},[u,h,g]),/*#__PURE__*/e.createElement("div",{ref:d,className:"color-board",style:{backgroundColor:`hsl(${l}, 100%, 50%)`},onMouseDown:e=>{p(!0),h(e)}},/*#__PURE__*/e.createElement("div",{className:"color-board-white"}),/*#__PURE__*/e.createElement("div",{className:"color-board-black"}),/*#__PURE__*/e.createElement("div",{className:"color-board-handler",style:{left:100*o+"%",top:100*(1-s)+"%"}}))},g=({value:l,max:o,onChange:s,className:i,style:m,children:d})=>{const u=t(null),[p,h]=a(!1),g=n(e=>{if(!u.current)return;const{width:t,left:a}=u.current.getBoundingClientRect(),n=c(e.clientX-a,0,t);s(n/t*o)},[o,s]),E=n(()=>{h(!1)},[]);return r(()=>{const e=e=>{p&&g(e)};return p&&(window.addEventListener("mousemove",e),window.addEventListener("mouseup",E)),()=>{window.removeEventListener("mousemove",e),window.removeEventListener("mouseup",E)}},[p,g,E]),/*#__PURE__*/e.createElement("div",{ref:u,className:`color-slider ${i||""}`,style:m,onMouseDown:e=>{h(!0),g(e)}},/*#__PURE__*/e.createElement("div",{className:"color-slider-handler",style:{left:l/o*100+"%"}}),d)},E=({hue:t,onChange:a})=>/*#__PURE__*/e.createElement(g,{value:t,max:360,onChange:a,className:"hue-slider"}),v=({hue:l,saturation:o,value:c,alpha:p,onChange:h})=>{const[g,E]=a("HEX"),[v,f]=a({}),[w,C]=a(!1),b=t(null);r(()=>{const e=e=>{b.current&&!b.current.contains(e.target)&&C(!1)};return document.addEventListener("mousedown",e),()=>{document.removeEventListener("mousedown",e)}},[]);const N=n(()=>i(l,o,c),[l,o,c]);r(()=>{const e=N();if("HEX"===g)f({hex:d(e.r,e.g,e.b)});else if("RGB"===g)f({r:e.r,g:e.g,b:e.b});else if("HSL"===g){const t=function(e,t,a){e/=255,t/=255,a/=255;let n,r,l=Math.max(e,t,a),o=Math.min(e,t,a),s=(l+o)/2;if(l===o)n=r=0;else{let c=l-o;switch(r=s>.5?c/(2-l-o):c/(l+o),l){case e:n=(t-a)/c+(t<a?6:0);break;case t:n=(a-e)/c+2;break;case a:n=(e-t)/c+4;break;default:n=0}n/=6}return{h:360*n,s:r,l:s}}(e.r,e.g,e.b);f({h:Math.round(t.h),s:Math.round(100*t.s),l:Math.round(100*t.l)})}},[l,o,c,g,N]);const k=(e,t)=>{const a=s({},v,{[e]:t});f(a);const n=parseInt(a.r,10),r=parseInt(a.g,10),l=parseInt(a.b,10);if(!isNaN(n)&&!isNaN(r)&&!isNaN(l)){const e=m(Math.min(255,Math.max(0,n)),Math.min(255,Math.max(0,r)),Math.min(255,Math.max(0,l)));h(s({},e,{a:p}))}},A=(e,t)=>{const a=s({},v,{[e]:t});f(a);const n=parseInt(a.h,10),r=parseInt(a.s,10),l=parseInt(a.l,10);if(!isNaN(n)&&!isNaN(r)&&!isNaN(l)){const e=function(e,t,a){let n,r,l;if(0===t)n=r=l=a;else{const o=(e,t,a)=>(a<0&&(a+=1),a>1&&(a-=1),a<1/6?e+6*(t-e)*a:a<.5?t:a<2/3?e+(t-e)*(2/3-a)*6:e),s=a<.5?a*(1+t):a+t-a*t,c=2*a-s;n=o(c,s,(e/=360)+1/3),r=o(c,s,e),l=o(c,s,e-1/3)}return{r:Math.round(255*n),g:Math.round(255*r),b:Math.round(255*l)}}(Math.min(360,Math.max(0,n)),Math.min(100,Math.max(0,r))/100,Math.min(100,Math.max(0,l))/100),t=m(e.r,e.g,e.b);h(s({},t,{a:p}))}};/*#__PURE__*/return e.createElement("div",{className:"color-input-container"},/*#__PURE__*/e.createElement("div",{className:"mode-selector",ref:b,onClick:()=>C(!w)},/*#__PURE__*/e.createElement("span",null,g.charAt(0)+g.slice(1).toLowerCase()),/*#__PURE__*/e.createElement("span",{className:"arrow",style:{fontSize:"10px",marginLeft:"4px",transform:w?"rotate(180deg)":"rotate(0deg)",display:"inline-block",transition:"transform 0.2s",color:"#8c8c8c"}},/*#__PURE__*/e.createElement("svg",{viewBox:"0 0 1024 1024",width:"10",height:"10",fill:"currentColor"},/*#__PURE__*/e.createElement("path",{d:"M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3 0.1-12.7-6.4-12.7z"}))),w&&/*#__PURE__*/e.createElement("div",{className:"mode-dropdown"},/*#__PURE__*/e.createElement("div",{className:"mode-option",onClick:e=>{e.stopPropagation(),E("HEX"),C(!1)}},"Hex"),/*#__PURE__*/e.createElement("div",{className:"mode-option",onClick:e=>{e.stopPropagation(),E("RGB"),C(!1)}},"RGB"),/*#__PURE__*/e.createElement("div",{className:"mode-option",onClick:e=>{e.stopPropagation(),E("HSL"),C(!1)}},"HSL"))),/*#__PURE__*/e.createElement("div",{className:"color-input-fields"},"HEX"===g&&/*#__PURE__*/e.createElement("div",{className:"hex-input-wrapper"},/*#__PURE__*/e.createElement("span",{className:"hex-prefix"},"#"),/*#__PURE__*/e.createElement("input",{className:"color-input hex",value:v.hex?v.hex.replace("#",""):"",onChange:e=>{const t=e.target.value;if(f(s({},v,{hex:t})),/^#?([0-9A-F]{3}|[0-9A-F]{6})$/i.test(t)){const e=u(t);if(e){const t=m(e.r,e.g,e.b);h(s({},t,{a:p}))}}}})),"RGB"===g&&/*#__PURE__*/e.createElement(e.Fragment,null,/*#__PURE__*/e.createElement("input",{className:"color-input",type:"number",placeholder:"R",value:void 0!==v.r?v.r:"",onChange:e=>k("r",e.target.value)}),/*#__PURE__*/e.createElement("input",{className:"color-input",type:"number",placeholder:"G",value:void 0!==v.g?v.g:"",onChange:e=>k("g",e.target.value)}),/*#__PURE__*/e.createElement("input",{className:"color-input",type:"number",placeholder:"B",value:void 0!==v.b?v.b:"",onChange:e=>k("b",e.target.value)})),"HSL"===g&&/*#__PURE__*/e.createElement(e.Fragment,null,/*#__PURE__*/e.createElement("input",{className:"color-input",type:"number",placeholder:"H",value:void 0!==v.h?v.h:"",onChange:e=>A("h",e.target.value)}),/*#__PURE__*/e.createElement("input",{className:"color-input",type:"number",placeholder:"S",value:void 0!==v.s?v.s:"",onChange:e=>A("s",e.target.value)}),/*#__PURE__*/e.createElement("input",{className:"color-input",type:"number",placeholder:"L",value:void 0!==v.l?v.l:"",onChange:e=>A("l",e.target.value)})),/*#__PURE__*/e.createElement("div",{className:"color-input alpha-display"},Math.round(100*p),"%")))},f=["#E0B5AE","#B2BBDE","#F2DDB3","#E0E5C5","#BBD0C3","#B5D1E3","#FFFFFF","#D25536","#EFA154","#F7DA7E","#5FA67F","#A2829D","#D390A2","#000000","#0099A4","#EABA00","#C9462C","#3171AC","#783780","#1E80EA","#2AAC3B","#B63455","#81532F","#AA9A5C","#828281","#055753","#8F262B","#F0D8D0"],w=({value:n,defaultValue:c,onChange:g,showLabel:w=!0,label:C="Color",showArrow:b=!0,showInput:N=!0,showColorBoard:k=!0,presets:A,tooltipText:L="Color Picker",screenPickerTooltip:x="屏幕取色",recommendedTitle:y="Recommended",recentTitle:M="Recent",moreText:F="More",lessText:B="Less"})=>{const[R,D]=a(!1),[I,H]=a(!1),[X,S]=a([]),T=A||f,[O,P]=a(()=>p(n||c||"#1677ff")),[U,z]=a(()=>{const e=i(O.h,O.s,O.v);return d(e.r,e.g,e.b).toUpperCase()}),$=t(null),G=t(null),Q=t(null),[Y,J]=a({});r(()=>{if(void 0!==n){const e=p(n);P(e);const t=i(e.h,e.s,e.v);z(d(t.r,t.g,t.b).toUpperCase())}},[n]);const V=e=>{const t=s({},O,e);P(t);const a=i(t.h,t.s,t.v),n=d(a.r,a.g,a.b).toUpperCase();z(n),g&&g(n,s({},a,{a:t.a}))};l(()=>{if(!R||!G.current||!Q.current||"undefined"==typeof window)return;const e=G.current.getBoundingClientRect(),t=Q.current.getBoundingClientRect(),a=window.innerHeight,n=window.innerWidth;let r=e.bottom+window.scrollY+4,l=e.left+window.scrollX;e.bottom+t.height+4>a&&e.top>t.height+4&&(r=e.top+window.scrollY-t.height-4),e.left+t.width>n&&(l=n-t.width-10),l<0&&(l=0),J({position:"absolute",top:r,left:l,zIndex:9999})},[R,I,X.length]),r(()=>{const e=e=>{const t=$.current,a=Q.current,n=t&&t.contains(e.target),r=a&&a.contains(e.target);n||r||D(!1)};if(R)document.addEventListener("mousedown",e);else{const e=i(O.h,O.s,O.v),t=d(e.r,e.g,e.b).toUpperCase();S(e=>e.includes(t)?e:[t,...e].slice(0,10))}return()=>{document.removeEventListener("mousedown",e)}},[R,O]);const q=i(O.h,O.s,O.v),Z=`rgba(${q.r}, ${q.g}, ${q.b}, ${O.a})`,K=I?T:T.slice(0,14),W=T.length>14,j=R?/*#__PURE__*/e.createElement("div",{className:"color-picker-panel",style:Y,ref:Q},k&&/*#__PURE__*/e.createElement("div",{className:"color-picker-board-wrapper",style:{marginTop:"10px",borderTop:"1px solid #eee"}},/*#__PURE__*/e.createElement(h,{hue:O.h,saturation:O.s,value:O.v,onChange:(e,t)=>V({s:e,v:t}),onComplete:()=>D(!1)}),/*#__PURE__*/e.createElement(E,{hue:O.h,onChange:e=>V({h:e})}),/*#__PURE__*/e.createElement(v,{hue:O.h,saturation:O.s,value:O.v,alpha:O.a,onChange:e=>V(e)})),/*#__PURE__*/e.createElement("div",{className:"color-picker-presets"},/*#__PURE__*/e.createElement("div",{className:"palette-section-title",style:{marginTop:8}},/*#__PURE__*/e.createElement("span",null,y),/*#__PURE__*/e.createElement("span",{className:"color-picker-icon-right",onClick:async()=>{if(window.EyeDropper)try{const e=new window.EyeDropper,t=await e.open(),{sRGBHex:a}=t,n=u(a);if(n){const e=m(n.r,n.g,n.b);V(s({},e,{a:1}))}}catch(e){console.log("EyeDropper failed or canceled:",e)}else alert("当前浏览器不支持屏幕取色功能")},title:x},/*#__PURE__*/e.createElement("svg",{width:"16",height:"16",viewBox:"0 0 16 16",xmlns:"http://www.w3.org/2000/svg"},/*#__PURE__*/e.createElement("defs",null,/*#__PURE__*/e.createElement("rect",{id:"path-1",x:"0",y:"0",width:"16",height:"16"})),/*#__PURE__*/e.createElement("g",{stroke:"none",strokeWidth:"1",fill:"none",fillRule:"evenodd"},/*#__PURE__*/e.createElement("g",{transform:"translate(-920.000000, -594.000000)"},/*#__PURE__*/e.createElement("g",{transform:"translate(720.000000, 418.000000)"},/*#__PURE__*/e.createElement("g",{transform:"translate(200.000000, 176.000000)"},/*#__PURE__*/e.createElement("mask",{id:"mask-2",fill:"white"},/*#__PURE__*/e.createElement("use",{xlinkHref:"#path-1"})),/*#__PURE__*/e.createElement("g",null),/*#__PURE__*/e.createElement("g",{mask:"url(#mask-2)",fill:"#000000",fillOpacity:"0.85",fillRule:"nonzero"},/*#__PURE__*/e.createElement("g",{transform:"translate(8.106532, 8.106532) rotate(-315.000000) translate(-8.106532, -8.106532) translate(-0.266667, -0.266667)"},/*#__PURE__*/e.createElement("path",{d:"M5.67238576,2.96585378 L6.99478644,4.28811977 L7.03978941,4.24867364 C7.66833128,3.72977631 8.60030981,3.76436946 9.18839345,4.3524531 L9.94264069,5.10670034 C10.1509203,5.31497996 10.1509203,5.65266795 9.94264069,5.86094757 L9.18778644,6.61411977 L13.7138769,11.1406782 C14.4428555,11.8696569 14.4428555,13.0515648 13.7138769,13.7805435 C12.9848982,14.5095222 11.8029902,14.5095222 11.0740115,13.7805435 L6.54778644,9.25411977 L5.7942809,10.0093074 C5.58600128,10.217587 5.24831329,10.217587 5.04003367,10.0093074 L4.28578644,9.25506012 C3.66094757,8.63022125 3.66094757,7.61715729 4.28578644,6.99231842 L4.35178644,6.92511977 L3.03252045,5.6057191 C2.30354177,4.87674042 2.30354177,3.69483246 3.03252045,2.96585378 C3.76149912,2.2368751 4.94340708,2.2368751 5.67238576,2.96585378 Z M8.43414622,7.36944204 L7.86778644,7.93411977 L7.30277537,8.50081289 L11.8282588,13.0262963 C12.1295204,13.3275579 12.6112769,13.3383172 12.925431,13.0585743 L12.9596296,13.0262963 C13.2720491,12.7138769 13.2720491,12.2073449 12.9596296,11.8949254 L8.43414622,7.36944204 Z M7.70907857,5.07958956 L7.67989899,5.10670034 L5.04003367,7.74656565 C4.83175405,7.95484528 4.83175405,8.29253326 5.04003367,8.50081289 L5.41715729,8.8779365 L8.81126984,5.48382395 L8.43414622,5.10670034 C8.23533385,4.90788797 7.91861014,4.89885105 7.70907857,5.07958956 Z M3.82096628,3.68782298 L3.78676768,3.72010101 C3.47434825,4.03252045 3.47434825,4.53905243 3.78676768,4.85147186 L5.10670034,6.17140452 L6.23807119,5.04003367 L4.91813853,3.72010101 C4.61687693,3.41883942 4.13512038,3.40808007 3.82096628,3.68782298 Z",transform:"translate(8.373199, 8.373199) rotate(-315.000000) translate(-8.373199, -8.373199)"})))))))))),/*#__PURE__*/e.createElement("div",{className:"presets-grid modern"},T.map((t,a)=>/*#__PURE__*/e.createElement("div",{key:a,className:"preset-item preset-item-inner",style:{backgroundColor:t},onClick:()=>{const e=u(t);if(e){const t=m(e.r,e.g,e.b);V(s({},t,{a:1})),D(!1)}},title:t}))),X.length>0&&/*#__PURE__*/e.createElement(e.Fragment,null,/*#__PURE__*/e.createElement("div",{className:"palette-section-title"},M),/*#__PURE__*/e.createElement("div",{className:"presets-grid recent"},X.map((t,a)=>/*#__PURE__*/e.createElement("div",{key:a,className:"preset-item",style:{backgroundColor:t},onClick:()=>{const e=u(t);if(e){const t=m(e.r,e.g,e.b);V(s({},t,{a:1})),D(!1)}},title:t})))))):null;/*#__PURE__*/return e.createElement("div",{className:"color-picker-container",ref:$},/*#__PURE__*/e.createElement("div",{className:"color-picker-main-row"},/*#__PURE__*/e.createElement("div",{className:"color-picker-tooltip-trigger"},w&&/*#__PURE__*/e.createElement("span",{className:"color-picker-label"},C),/*#__PURE__*/e.createElement("div",{className:"color-picker-trigger "+(R?"is-open":""),onClick:()=>D(!R),ref:G},/*#__PURE__*/e.createElement("div",{className:"color-block",style:{backgroundColor:Z}}),b&&/*#__PURE__*/e.createElement("span",{className:"color-picker-arrow "+(R?"open":"")},/*#__PURE__*/e.createElement("svg",{width:"16",height:"16",viewBox:"0 0 16 16",xmlns:"http://www.w3.org/2000/svg"},/*#__PURE__*/e.createElement("g",{stroke:"none",strokeWidth:"1",fill:"none",fillRule:"evenodd"},/*#__PURE__*/e.createElement("g",{transform:"translate(-1348.000000, -88.000000)",fillRule:"nonzero"},/*#__PURE__*/e.createElement("g",{transform:"translate(0.000000, 60.000000)"},/*#__PURE__*/e.createElement("g",{transform:"translate(584.000000, 20.000000)"},/*#__PURE__*/e.createElement("g",{transform:"translate(728.000000, 4.000000)"},/*#__PURE__*/e.createElement("g",{transform:"translate(44.000000, 12.000000) rotate(-360.000000) translate(-44.000000, -12.000000) translate(36.000000, 4.000000)"},/*#__PURE__*/e.createElement("rect",{fill:"#000000",opacity:"0",x:"0",y:"0",width:"16",height:"16"}),/*#__PURE__*/e.createElement("path",{d:"M13.0750341,5.34788541 C12.9440655,5.21691678 12.7257845,5.21691678 12.5948158,5.34788541 L8.01091405,9.93178717 L3.40518417,5.34788541 C3.27421555,5.21691678 3.05593452,5.21691678 2.92496589,5.34788541 C2.79399727,5.47885403 2.79399727,5.69713506 2.92496589,5.82810369 L7.77080491,10.6521146 C7.90177353,10.7830832 8.12005456,10.7830832 8.25102319,10.6521146 L13.0750341,5.82810369 C13.2060027,5.69713506 13.2060027,5.47885403 13.0750341,5.34788541 Z",stroke:"#FFFFFF"}))))))))),/*#__PURE__*/e.createElement("span",{className:"tooltip-text"},L))),N&&/*#__PURE__*/e.createElement("div",{className:"color-picker-input-wrapper"},/*#__PURE__*/e.createElement("input",{type:"text",value:U,onChange:e=>{const t=e.target.value;if(z(t),/^#?([0-9A-F]{3}|[0-9A-F]{6})$/i.test(t)){const e=u(t);if(e){const t=m(e.r,e.g,e.b);V(s({},t,{a:O.a}))}}},placeholder:"Please input color"}),U&&/*#__PURE__*/e.createElement("span",{className:"input-clear-icon",onClick:()=>z("")},/*#__PURE__*/e.createElement("img",{src:"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAA8klEQVQ4T51SwVHDQAzcdQOETugAqISkg/Cw9CRf2Q+gAkwlJB1QimnAYnRz57m55AG5l2+9K632RFw44zg+ALiPX+5+FJFTS2MNmNme5AuATUOcARxE5L3gq9DMJpJPlxxU2CQiu7gnYe70mq19tgXcfcXc/VlV34pwJnkTBFXdDsOwBfCRO+1EZKoczSJyywjC3b8qO4mYxai+SyGQfKSZHXIg9XhJHEDTPXHC7vXCq63mVP8cjrv/qOrm7DkAxGyRan1qLM3/rwUoz7UuQCkdixCrFW9atwt7JPcl6TNhIUdgy7Lcxb3ruu++74/tKv4CNXed5xhXezYAAAAASUVORK5CYII=",alt:"",width:"12",height:"12"})))),"undefined"!=typeof document&&o.createPortal(j,document.body),/*#__PURE__*/e.createElement("div",null,/*#__PURE__*/e.createElement("div",{className:"presets-grid modern"},K.map((t,a)=>/*#__PURE__*/e.createElement("div",{key:a,className:"preset-item",style:{backgroundColor:t},onClick:()=>{const e=u(t);if(e){const t=m(e.r,e.g,e.b);V(s({},t,{a:1}))}},title:t}))),W&&/*#__PURE__*/e.createElement("div",{className:"presets-collapse",onClick:()=>H(!I)},I?B:F,/*#__PURE__*/e.createElement("span",{className:"collapse-arrow "+(I?"expanded":"")},"▼"))))};export{w as default};
2
2
  //# sourceMappingURL=index.modern.mjs.map