Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@atomik-color/core

Package Overview
Dependencies
Maintainers
1
Versions
13
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@atomik-color/core - npm Package Compare versions

Comparing version 1.0.7 to 1.0.8

dist/index.js

8

CHANGELOG.md

@@ -6,2 +6,10 @@ # Change Log

## [1.0.8](https://github.com/deebov/color-picker/compare/@atomik-color/core@1.0.7...@atomik-color/core@1.0.8) (2020-10-02)
**Note:** Version bump only for package @atomik-color/core
## [1.0.7](https://github.com/deebov/color-picker/compare/@atomik-color/core@1.0.6...@atomik-color/core@1.0.7) (2020-10-02)

@@ -8,0 +16,0 @@

2

dist/color/converters.d.ts
import { HSL, HSV, RGB, RGBA } from "../types";
import { getColorFromString } from "./getColorFromString";
export declare const hsv2Rgb: (hsv: HSV) => {

@@ -33,2 +32,1 @@ r: number;

};
export declare const str2Color: typeof getColorFromString;
export * from "./converters";
export { getColorFromString as str2Color } from "./getColorFromString";

@@ -1,2 +0,2 @@

import{useState as r,useEffect as e,useRef as t}from"react";var n;!function(r){r.PageUp="PageUp",r.PageDown="PageDown",r.End="End",r.Home="Home",r.ArrowLeft="ArrowLeft",r.ArrowUp="ArrowUp",r.ArrowRight="ArrowRight",r.ArrowDown="ArrowDown",r.Tab="Tab"}(n||(n={}));var a=n;function o(r=0,e,t=0){return r<t?t:r>e?e:r}const s=(r,e,t,n)=>{let a=(r.clientX-e.left)/e.width;return a=o(Math.round(a*t),t,n),a},i=(r,e,t,n)=>{let a=(r.clientY-e.top)/e.height;return a=o(Math.round(a*t),t,n),a},c=r=>{var{ref:e,onStep:t,ariaLabel:n,ariaValueNow:o,ariaValueText:c,maxValue:l=100,minValue:u=0,step:b=1,bigStep:g=10}=r,h=function(r,e){var t={};for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&e.indexOf(n)<0&&(t[n]=r[n]);if(null!=r&&"function"==typeof Object.getOwnPropertySymbols){var a=0;for(n=Object.getOwnPropertySymbols(r);a<n.length;a++)e.indexOf(n[a])<0&&Object.prototype.propertyIsEnumerable.call(r,n[a])&&(t[n[a]]=r[n[a]])}return t}(r,["ref","onStep","ariaLabel","ariaValueNow","ariaValueText","maxValue","minValue","step","bigStep"]);const p=r=>{if(!e.current||"function"!=typeof h.onChange)return;r.preventDefault();const t=e.current.getBoundingClientRect();if("both"===h.direction){let e=s(r,t,l,u),n=i(r,t,l,u);return h.onChange({x:e,y:n})}if("horizontal"===h.direction){let e=s(r,t,l,u);return h.onChange(e)}if("vertical"===h.direction){let e=i(r,t,l,u);return h.onChange(e)}};return{sliderProps:{tabIndex:0,onPointerDown:r=>{var t;e.current&&(r.preventDefault(),e.current.focus(),document.body.style.touchAction="none",e.current.onpointermove=p,null===(t=e.current)||void 0===t||t.setPointerCapture(r.pointerId),p(r))},onPointerUp:r=>{e.current&&(e.current.onpointermove=null,e.current.releasePointerCapture(r.pointerId),document.body.style.touchAction="auto")},onKeyDown:r=>{var e,n;r.key!==a.Tab&&r.preventDefault();let o=r.shiftKey?g:b;switch(r.key){case a.ArrowLeft:case a.ArrowDown:null==t||t(-o);break;case a.ArrowRight:case a.ArrowUp:null==t||t(o);break;case a.Home:"vertical"!==h.direction&&"horizontal"!==h.direction||null===(e=h.onChange)||void 0===e||e.call(h,u);break;case a.End:"vertical"!==h.direction&&"horizontal"!==h.direction||null===(n=h.onChange)||void 0===n||n.call(h,l);break;default:return}},role:"slider","aria-valuemin":u,"aria-valuemax":l,"aria-label":n,"aria-valuenow":o,"aria-valuetext":c}}},l=({state:r,ref:e})=>{const{sliderProps:t}=c({ref:e,direction:"horizontal",onChange:e=>r.setA(e),onStep:e=>r.rotateA(e),maxValue:100,ariaLabel:"Alpha slider",ariaValueNow:r.color.a,ariaValueText:String(r.color.a)});return{sliderProps:t}};function u(r){if(!r)return;const e=b(r)||function(r){if("#"===r[0]&&7===r.length&&/^#[\da-fA-F]{6}$/.test(r))return{r:parseInt(r.slice(1,3),16),g:parseInt(r.slice(3,5),16),b:parseInt(r.slice(5,7),16),a:100}}(r)||function(r){if("#"===r[0]&&4===r.length&&/^#[\da-fA-F]{3}$/.test(r))return{r:parseInt(r[1]+r[1],16),g:parseInt(r[2]+r[2],16),b:parseInt(r[3]+r[3],16),a:100}}(r)||function(r){const e=r.match(/^hsl(a?)\(([\d., ]+)\)$/);if(e){const r=!!e[1],t=r?4:3,n=e[2].split(/ *, */).map(Number);if(n.length===t){const e=x({h:n[0],s:n[1],l:n[2]});return e.a=r?100*n[3]:100,e}}}(r);return e||function(r){if("undefined"==typeof document)return;const e=document.createElement("div");e.style.backgroundColor=r,e.style.position="absolute",e.style.top="-9999px",e.style.left="-9999px",e.style.height="1px",e.style.width="1px",document.body.appendChild(e);const t=getComputedStyle(e),n=t&&t.backgroundColor;if(document.body.removeChild(e),"rgba(0, 0, 0, 0)"===n||"transparent"===n){switch(r.trim()){case"transparent":case"#0000":case"#00000000":return{r:0,g:0,b:0,a:0}}return}return b(n)}(r)}function b(r){if(!r)return;const e=r.match(/^rgb(a?)\(([\d., ]+)\)$/);if(e){const r=!!e[1],t=r?4:3,n=e[2].split(/ *, */).map(Number);if(n.length===t)return{r:n[0],g:n[1],b:n[2],a:r?100*n[3]:100}}}const g=(r,e,t=0)=>(r=>"number"==typeof r&&!1===isNaN(r))(r)&&r>=t&&r<=e,h=r=>/(^#{0,1}[0-9A-F]{6}$)|(^#{0,1}[0-9A-F]{3}$)/i.test(r),p=r=>{const{h:e,s:t,v:n}=(({h:r,s:e,v:t})=>({h:o(r,359,0),s:o(e,100,0),v:o(t,100,0)}))(r);let a=n/100,s=t/100*a,i=e/60,c=s*(1-Math.abs(i%2-1)),l=a-s;return s=255*(s+l)|0,c=255*(c+l)|0,l=255*l|0,i>=0&&i<1?{r:s,g:c,b:l}:i>=1&&i<2?{r:c,g:s,b:l}:i>=2&&i<3?{r:l,g:s,b:c}:i>=3&&i<4?{r:l,g:c,b:s}:i>=4&&i<5?{r:c,g:l,b:s}:i>=5&&i<6?{r:s,g:l,b:c}:{r:0,g:0,b:0}},d=({h:r,s:e,v:t})=>{let{r:n,g:a,b:o}=p({h:r,s:e,v:t});return m({r:n,g:a,b:o})},f=r=>{const{r:e,g:t,b:n}=(({r:r,g:e,b:t})=>({r:o(r,255,0),g:o(e,255,0),b:o(t,255,0)}))(r);let a=e/255,s=t/255,i=n/255,c=Math.max(a,s,i),l=c-Math.min(a,s,i),u=0,b=0,g=0;return l&&(c===a&&(u=(s-i)/l),c===s&&(u=2+(i-a)/l),c===i&&(u=4+(a-s)/l),c&&(b=l/c)),u=60*u|0,u<0&&(u+=360),b=100*b|0,g=100*c|0,{h:u,s:b,v:g}},v=({r:r,g:e,b:t})=>{let n=r/255,a=e/255,o=t/255,s=Math.max(n,a,o),i=Math.min(n,a,o),c=s-i,l=0,u=0,b=(s+i)/2,g=1-Math.abs(2*b-1);return c&&(s===n&&(l=(a-o)/c),s===a&&(l=2+(o-n)/c),s===o&&(l=4+(n-a)/c),s&&(u=c/g)),l=60*l|0,l<0&&(l+=360),u=100*u|0,b=100*b|0,{h:l,s:u,l:b}},m=({r:r,g:e,b:t},n=!0)=>(n?"#":"")+((1<<24)+(r<<16)+(e<<8)+t).toString(16).slice(1),w=({r:r,g:e,b:t,a:n})=>"number"==typeof n&&!1===isNaN(n)?`rgba(${r}, ${e}, ${t}, ${o(n,100,0)/100})`:`rgb(${r}, ${e}, ${t})`,y=r=>r.a<100?w(r):m(r),x=({h:r,s:e,l:t})=>{let n=t/100,a=e/100*(1-Math.abs(2*n-1)),o=r/60,s=a*(1-Math.abs(o%2-1)),i=n-a/2;return a=255*(a+i)|0,s=255*(s+i)|0,i=255*i|0,o>=0&&o<1?{r:a,g:s,b:i}:o>=1&&o<2?{r:s,g:a,b:i}:o>=2&&o<3?{r:i,g:a,b:s}:o>=3&&o<4?{r:i,g:s,b:a}:o>=4&&o<5?{r:s,g:i,b:a}:o>=5&&o<6?{r:a,g:i,b:s}:{r:0,g:0,b:0}},A=(r,e=null)=>{if(!0!==h(r))return e;return"#"===r[0]&&(r=r.slice(1,r.length)),3===r.length&&(r=r.replace(/([0-9A-F])([0-9A-F])([0-9A-F])/i,"$1$1$2$2$3$3")),{r:parseInt(r.substr(0,2),16),g:parseInt(r.substr(2,2),16),b:parseInt(r.substr(4,2),16)}},V=r=>{const e=A(r)||{r:0,g:0,b:0};return f(e)},S=function(r){const e=u(r);if(e)return Object.assign(Object.assign({},(({r:r,g:e,b:t,a:n})=>{const{h:a,s:o,v:s}=f({r:r,g:e,b:t});return{r:r,g:e,b:t,a:n,h:a,s:o,v:s,hex:m({r:r,g:e,b:t},!1),str:y({r:r,g:e,b:t,a:n})}})(e)),{str:r})},O={h:0,s:50,v:50,a:100,r:128,g:64,b:64,hex:"804040",str:"#804040"},k=(r,e,t)=>{(r=>g(r,255))(t)&&r(r=>{const{r:n,g:a,b:o,a:s}=Object.assign(Object.assign({},r),{[e]:t}),{h:i,s:c,v:l}=f({r:n,g:a,b:o});return{r:n,g:a,b:o,a:s,h:i,s:c,v:l,hex:m({r:n,g:a,b:o},!1),str:y({r:n,g:a,b:o,a:s})}})},C=(r,e,t,n=100)=>{g(t,n)&&r(r=>{const{h:n,s:a,v:o,a:s}=Object.assign(Object.assign({},r),{[e]:t}),{r:i,g:c,b:l}=p({h:n,s:a,v:o});return{h:n,s:a,v:o,r:i,g:c,b:l,a:s,hex:m({r:i,g:c,b:l},!1),str:y({r:i,g:c,b:l,a:s})}})},P=(r,e,t,n=100)=>{r(r=>{const{h:a,s:s,v:i,a:c}=Object.assign(Object.assign({},r),{[e]:o(r[e]+t,n,0)}),{r:l,g:u,b:b}=p({h:a,s:s,v:i});return{h:a,s:s,v:i,r:l,g:u,b:b,a:c,hex:m({r:l,g:u,b:b},!1),str:y({r:l,g:u,b:b,a:c})}})},$=t=>{const[n,a]=r(t.defaultValue||O);e(()=>{t.value&&a(t.value)},[t.value]);const s=r=>{if("function"==typeof t.onChange){if(void 0!==t.value)return void t.onChange("function"==typeof r?r(n):r);t.onChange("function"==typeof r?r(n):r)}a(r)};return{setH:r=>C(s,"h",r,359),setS:r=>C(s,"s",r),setV:r=>C(s,"v",r),setR:r=>k(s,"r",r),setG:r=>k(s,"g",r),setB:r=>k(s,"b",r),setA:r=>{g(r,100)&&s(e=>{const t=Object.assign(Object.assign({},e),{a:r});return t.str=y(t),t})},setSV:(r,e)=>{(g(r,100)||g(e,100))&&s(t=>{const{h:n,a:a}=t,{r:o,g:s,b:i}=p({h:n,s:r,v:e}),c=m({r:o,g:s,b:i},!1),l=y({r:o,g:s,b:i,a:a});return{h:n,s:r,v:e,r:o,g:s,b:i,a:a,hex:c,str:l}})},setHex:r=>{h(r)&&s(({a:e})=>{const{r:t,g:n,b:a}=A(r,{r:0,g:0,b:0}),{h:o,s:s,v:i}=f({r:t,g:n,b:a}),c=y({r:t,g:n,b:a,a:e});return{r:t,g:n,b:a,h:o,s:s,v:i,hex:r,a:e,str:c}})},rotateH:r=>P(s,"h",r,359),rotateS:r=>P(s,"s",r),rotateV:r=>P(s,"v",r),rotateA:r=>{s(e=>Object.assign(Object.assign({},e),{a:o(e.a+r,100,0)}))},color:n,getSolidColor:()=>d({h:n.h,s:100,v:100})}},j="Saturation and brightness",D="Saturation {0} brightness {1}",I="Use left and right arrow keys to set saturation. Use up and down arrow keys to set brightness.",N=({state:r,ref:e,ariaDescription:n=I,ariaLabel:o=j,ariaValueFormat:s=D})=>{const i=t(!1),l=r.color,u=s.replace("{0}",String(l.s)).replace("{1}",String(l.v)),{sliderProps:b}=c({ref:e,maxValue:100,direction:"both",ariaLabel:o,ariaValueText:u,ariaValueNow:i.current?l.s:l.v,onChange({x:e,y:t}){t=100-t,r.setSV(e,t)}});return{containerProps:Object.assign(Object.assign({},b),{onKeyDown:e=>{e.key!==a.Tab&&e.preventDefault();const t=e.shiftKey?10:1;switch(e.key){case a.ArrowUp:i.current=!1,r.rotateV(t);break;case a.ArrowDown:i.current=!1,r.rotateV(-t);break;case a.ArrowLeft:i.current=!0,r.rotateS(-t);break;case a.ArrowRight:i.current=!0,r.rotateS(t);break;case a.Home:i.current=!0,r.setS(0);break;case a.End:i.current=!0,r.setS(100);break;case a.PageUp:i.current=!1,r.setV(100);break;case a.PageDown:i.current=!1,r.setV(0)}},"aria-describedby":"color-picker-desc",id:"color-rectangle1"}),descriptionProps:{id:"color-picker-desc",children:n}}},H=({state:r,ref:e})=>{const{sliderProps:t}=c({ref:e,direction:"horizontal",onChange:e=>r.setH(e),onStep:e=>r.rotateH(e),maxValue:359,ariaLabel:"Hue slider",ariaValueNow:r.color.h,ariaValueText:String(r.color.h)});return{sliderProps:t}};export{V as hex2Hsv,A as hex2Rgb,x as hsl2Rgb,d as hsv2Hex,p as hsv2Rgb,m as rgb2Hex,v as rgb2Hsl,f as rgb2Hsv,w as rgba2RgbStr,y as rgba2Str,S as str2Color,l as useAlpha,N as useColorRectangle,$ as useColorState,H as useHue,c as useSlider};
import{useState as r,useEffect as e,useRef as t}from"react";var a;!function(r){r.PageUp="PageUp",r.PageDown="PageDown",r.End="End",r.Home="Home",r.ArrowLeft="ArrowLeft",r.ArrowUp="ArrowUp",r.ArrowRight="ArrowRight",r.ArrowDown="ArrowDown",r.Tab="Tab"}(a||(a={}));var n=a;function o(r=0,e,t=0){return r<t?t:r>e?e:r}const s=(r,e,t,a)=>{let n=(r.clientX-e.left)/e.width;return n=o(Math.round(n*t),t,a),n},i=(r,e,t,a)=>{let n=(r.clientY-e.top)/e.height;return n=o(Math.round(n*t),t,a),n},c=r=>{var{ref:e,onStep:t,ariaLabel:a,ariaValueNow:o,ariaValueText:c,maxValue:l=100,minValue:u=0,step:b=1,bigStep:g=10}=r,h=function(r,e){var t={};for(var a in r)Object.prototype.hasOwnProperty.call(r,a)&&e.indexOf(a)<0&&(t[a]=r[a]);if(null!=r&&"function"==typeof Object.getOwnPropertySymbols){var n=0;for(a=Object.getOwnPropertySymbols(r);n<a.length;n++)e.indexOf(a[n])<0&&Object.prototype.propertyIsEnumerable.call(r,a[n])&&(t[a[n]]=r[a[n]])}return t}(r,["ref","onStep","ariaLabel","ariaValueNow","ariaValueText","maxValue","minValue","step","bigStep"]);const p=r=>{if(!e.current||"function"!=typeof h.onChange)return;r.preventDefault();const t=e.current.getBoundingClientRect();if("both"===h.direction){let e=s(r,t,l,u),a=i(r,t,l,u);return h.onChange({x:e,y:a})}if("horizontal"===h.direction){let e=s(r,t,l,u);return h.onChange(e)}if("vertical"===h.direction){let e=i(r,t,l,u);return h.onChange(e)}};return{sliderProps:{tabIndex:0,onPointerDown:r=>{var t;e.current&&(r.preventDefault(),e.current.focus(),document.body.style.touchAction="none",e.current.onpointermove=p,null===(t=e.current)||void 0===t||t.setPointerCapture(r.pointerId),p(r))},onPointerUp:r=>{e.current&&(e.current.onpointermove=null,e.current.releasePointerCapture(r.pointerId),document.body.style.touchAction="auto")},onKeyDown:r=>{var e,a;r.key!==n.Tab&&r.preventDefault();let o=r.shiftKey?g:b;switch(r.key){case n.ArrowLeft:case n.ArrowDown:null==t||t(-o);break;case n.ArrowRight:case n.ArrowUp:null==t||t(o);break;case n.Home:"vertical"!==h.direction&&"horizontal"!==h.direction||null===(e=h.onChange)||void 0===e||e.call(h,u);break;case n.End:"vertical"!==h.direction&&"horizontal"!==h.direction||null===(a=h.onChange)||void 0===a||a.call(h,l);break;default:return}},role:"slider","aria-valuemin":u,"aria-valuemax":l,"aria-label":a,"aria-valuenow":o,"aria-valuetext":c}}},l=({state:r,ref:e})=>{const{sliderProps:t}=c({ref:e,direction:"horizontal",onChange:e=>r.setA(e),onStep:e=>r.rotateA(e),maxValue:100,ariaLabel:"Alpha slider",ariaValueNow:r.color.a,ariaValueText:String(r.color.a)});return{sliderProps:t}},u=(r,e,t=0)=>(r=>"number"==typeof r&&!1===isNaN(r))(r)&&r>=t&&r<=e,b=r=>/(^#{0,1}[0-9A-F]{6}$)|(^#{0,1}[0-9A-F]{3}$)/i.test(r),g=r=>{const{h:e,s:t,v:a}=(({h:r,s:e,v:t})=>({h:o(r,359,0),s:o(e,100,0),v:o(t,100,0)}))(r);let n=a/100,s=t/100*n,i=e/60,c=s*(1-Math.abs(i%2-1)),l=n-s;return s=255*(s+l)|0,c=255*(c+l)|0,l=255*l|0,i>=0&&i<1?{r:s,g:c,b:l}:i>=1&&i<2?{r:c,g:s,b:l}:i>=2&&i<3?{r:l,g:s,b:c}:i>=3&&i<4?{r:l,g:c,b:s}:i>=4&&i<5?{r:c,g:l,b:s}:i>=5&&i<6?{r:s,g:l,b:c}:{r:0,g:0,b:0}},h=({h:r,s:e,v:t})=>{let{r:a,g:n,b:o}=g({h:r,s:e,v:t});return v({r:a,g:n,b:o})},p=r=>{const{r:e,g:t,b:a}=(({r:r,g:e,b:t})=>({r:o(r,255,0),g:o(e,255,0),b:o(t,255,0)}))(r);let n=e/255,s=t/255,i=a/255,c=Math.max(n,s,i),l=c-Math.min(n,s,i),u=0,b=0,g=0;return l&&(c===n&&(u=(s-i)/l),c===s&&(u=2+(i-n)/l),c===i&&(u=4+(n-s)/l),c&&(b=l/c)),u=60*u|0,u<0&&(u+=360),b=100*b|0,g=100*c|0,{h:u,s:b,v:g}},d=({r:r,g:e,b:t})=>{let a=r/255,n=e/255,o=t/255,s=Math.max(a,n,o),i=Math.min(a,n,o),c=s-i,l=0,u=0,b=(s+i)/2,g=1-Math.abs(2*b-1);return c&&(s===a&&(l=(n-o)/c),s===n&&(l=2+(o-a)/c),s===o&&(l=4+(a-n)/c),s&&(u=c/g)),l=60*l|0,l<0&&(l+=360),u=100*u|0,b=100*b|0,{h:l,s:u,l:b}},v=({r:r,g:e,b:t},a=!0)=>(a?"#":"")+((1<<24)+(r<<16)+(e<<8)+t).toString(16).slice(1),f=({r:r,g:e,b:t,a:a})=>"number"==typeof a&&!1===isNaN(a)?`rgba(${r}, ${e}, ${t}, ${o(a,100,0)/100})`:`rgb(${r}, ${e}, ${t})`,w=r=>r.a<100?f(r):v(r),y=({h:r,s:e,l:t})=>{let a=t/100,n=e/100*(1-Math.abs(2*a-1)),o=r/60,s=n*(1-Math.abs(o%2-1)),i=a-n/2;return n=255*(n+i)|0,s=255*(s+i)|0,i=255*i|0,o>=0&&o<1?{r:n,g:s,b:i}:o>=1&&o<2?{r:s,g:n,b:i}:o>=2&&o<3?{r:i,g:n,b:s}:o>=3&&o<4?{r:i,g:s,b:n}:o>=4&&o<5?{r:s,g:i,b:n}:o>=5&&o<6?{r:n,g:i,b:s}:{r:0,g:0,b:0}},m=(r,e=null)=>{if(!0!==b(r))return e;return"#"===r[0]&&(r=r.slice(1,r.length)),3===r.length&&(r=r.replace(/([0-9A-F])([0-9A-F])([0-9A-F])/i,"$1$1$2$2$3$3")),{r:parseInt(r.substr(0,2),16),g:parseInt(r.substr(2,2),16),b:parseInt(r.substr(4,2),16)}},A=r=>{const e=m(r)||{r:0,g:0,b:0};return p(e)};const x={h:0,s:50,v:50,a:100,r:128,g:64,b:64,hex:"804040",str:"#804040"},V=(r,e,t)=>{(r=>u(r,255))(t)&&r(r=>{const{r:a,g:n,b:o,a:s}=Object.assign(Object.assign({},r),{[e]:t}),{h:i,s:c,v:l}=p({r:a,g:n,b:o});return{r:a,g:n,b:o,a:s,h:i,s:c,v:l,hex:v({r:a,g:n,b:o},!1),str:w({r:a,g:n,b:o,a:s})}})},S=(r,e,t,a=100)=>{u(t,a)&&r(r=>{const{h:a,s:n,v:o,a:s}=Object.assign(Object.assign({},r),{[e]:t}),{r:i,g:c,b:l}=g({h:a,s:n,v:o});return{h:a,s:n,v:o,r:i,g:c,b:l,a:s,hex:v({r:i,g:c,b:l},!1),str:w({r:i,g:c,b:l,a:s})}})},O=(r,e,t,a=100)=>{r(r=>{const{h:n,s:s,v:i,a:c}=Object.assign(Object.assign({},r),{[e]:o(r[e]+t,a,0)}),{r:l,g:u,b:b}=g({h:n,s:s,v:i});return{h:n,s:s,v:i,r:l,g:u,b:b,a:c,hex:v({r:l,g:u,b:b},!1),str:w({r:l,g:u,b:b,a:c})}})},P=t=>{const[a,n]=r(t.defaultValue||x);e(()=>{t.value&&n(t.value)},[t.value]);const s=r=>{if("function"==typeof t.onChange){if(void 0!==t.value)return void t.onChange("function"==typeof r?r(a):r);t.onChange("function"==typeof r?r(a):r)}n(r)};return{setH:r=>S(s,"h",r,359),setS:r=>S(s,"s",r),setV:r=>S(s,"v",r),setR:r=>V(s,"r",r),setG:r=>V(s,"g",r),setB:r=>V(s,"b",r),setA:r=>{u(r,100)&&s(e=>{const t=Object.assign(Object.assign({},e),{a:r});return t.str=w(t),t})},setSV:(r,e)=>{(u(r,100)||u(e,100))&&s(t=>{const{h:a,a:n}=t,{r:o,g:s,b:i}=g({h:a,s:r,v:e}),c=v({r:o,g:s,b:i},!1),l=w({r:o,g:s,b:i,a:n});return{h:a,s:r,v:e,r:o,g:s,b:i,a:n,hex:c,str:l}})},setHex:r=>{b(r)&&s(({a:e})=>{const{r:t,g:a,b:n}=m(r,{r:0,g:0,b:0}),{h:o,s:s,v:i}=p({r:t,g:a,b:n}),c=w({r:t,g:a,b:n,a:e});return{r:t,g:a,b:n,h:o,s:s,v:i,hex:r,a:e,str:c}})},rotateH:r=>O(s,"h",r,359),rotateS:r=>O(s,"s",r),rotateV:r=>O(s,"v",r),rotateA:r=>{s(e=>Object.assign(Object.assign({},e),{a:o(e.a+r,100,0)}))},color:a,getSolidColor:()=>h({h:a.h,s:100,v:100})}},k="Saturation and brightness",j="Saturation {0} brightness {1}",C="Use left and right arrow keys to set saturation. Use up and down arrow keys to set brightness.",D=({state:r,ref:e,ariaDescription:a=C,ariaLabel:o=k,ariaValueFormat:s=j})=>{const i=t(!1),l=r.color,u=s.replace("{0}",String(l.s)).replace("{1}",String(l.v)),{sliderProps:b}=c({ref:e,maxValue:100,direction:"both",ariaLabel:o,ariaValueText:u,ariaValueNow:i.current?l.s:l.v,onChange({x:e,y:t}){t=100-t,r.setSV(e,t)}});return{containerProps:Object.assign(Object.assign({},b),{onKeyDown:e=>{e.key!==n.Tab&&e.preventDefault();const t=e.shiftKey?10:1;switch(e.key){case n.ArrowUp:i.current=!1,r.rotateV(t);break;case n.ArrowDown:i.current=!1,r.rotateV(-t);break;case n.ArrowLeft:i.current=!0,r.rotateS(-t);break;case n.ArrowRight:i.current=!0,r.rotateS(t);break;case n.Home:i.current=!0,r.setS(0);break;case n.End:i.current=!0,r.setS(100);break;case n.PageUp:i.current=!1,r.setV(100);break;case n.PageDown:i.current=!1,r.setV(0)}},"aria-describedby":"color-picker-desc",id:"color-rectangle1"}),descriptionProps:{id:"color-picker-desc",children:a}}},$=({state:r,ref:e})=>{const{sliderProps:t}=c({ref:e,direction:"horizontal",onChange:e=>r.setH(e),onStep:e=>r.rotateH(e),maxValue:359,ariaLabel:"Hue slider",ariaValueNow:r.color.h,ariaValueText:String(r.color.h)});return{sliderProps:t}};export{A as hex2Hsv,m as hex2Rgb,y as hsl2Rgb,h as hsv2Hex,g as hsv2Rgb,v as rgb2Hex,d as rgb2Hsl,p as rgb2Hsv,f as rgba2RgbStr,w as rgba2Str,l as useAlpha,D as useColorRectangle,P as useColorState,$ as useHue,c as useSlider};
//# sourceMappingURL=index.esm.js.map
{
"name": "@atomik-color/core",
"version": "1.0.7",
"version": "1.0.8",
"license": "MIT",

@@ -39,3 +39,3 @@ "author": "Dilshod Turobov <deebov@yandex.com",

},
"gitHead": "87f1e6f6d61fdfb57a5849288ed94356f6f9c52b"
"gitHead": "28c16e9305be091739b7b5b18f44ef6c56d2caec"
}

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc