@corva/ui 0.31.0-4 → 0.31.0-5
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.
- package/assets/39f55985e0da1489ad22264208b0493d.svg +4 -0
- package/components/ColorPicker/ColorPicker.js +1 -1
- package/components/ColorPicker/PaletteChromePicker/ColorSquare/ColorSquare.js +1 -1
- package/components/ColorPicker/PaletteChromePicker/Palette/Palette.js +1 -1
- package/components/ColorPicker/PaletteChromePicker/Palette/PaletteConstants.js +1 -1
- package/components/ColorPicker/PaletteChromePicker/PaletteChromePicker.js +1 -1
- package/components/IconButton/index.js +1 -1
- package/package.json +1 -1
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
<svg xmlns="http://www.w3.org/2000/svg" height="120" viewBox="0 0 18 12" width="180">
|
|
2
|
+
<path d="M0 0h18v12H0z" fill="#fff"/>
|
|
3
|
+
<path d="M0 0h1v12h1V0h1v12h1V0h1v12h1V0h1v12h1V0h1v12h1V0h1v12h1V0h1v12h1V0h1v12h1V0h1v12h1v-1H0v-1h18V9H0V8h18V7H0V6h18V5H0V4h18V3H0V2h18V1H0z" fill="#ccc" fill-rule="evenodd"/>
|
|
4
|
+
</svg>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import
|
|
1
|
+
import e from"@babel/runtime/helpers/defineProperty";import r from"@babel/runtime/helpers/slicedToArray";import o from"chroma-js";import{jsxs as n,jsx as t}from"react/jsx-runtime";import{withStyles as a,InputLabel as i,IconButton as l,Popover as c}from"@material-ui/core";import{useState as p,useRef as s,useEffect as b}from"react";import g from"prop-types";import u from"classnames";import{ColorLens as m}from"@material-ui/icons";import h from"./PaletteChromePicker/PaletteChromePicker.js";var f={root:{position:"relative",display:"flex"},topLabelRoot:{flexDirection:"column"},rightLabelRoot:{flexDirection:"row-reverse",justifyContent:"flex-end",alignItems:"center"},button:{width:"36px",height:"24px",boxShadow:"0px 3px 6px rgba(0, 0, 0, 0.161)",borderRadius:"5px"},buttonTransparrent:{position:"relative",backgroundImage:"url(".concat("/static/media/39f55985e0da1489ad22264208b0493d.svg",")"),backgroundSize:"cover",backgroundPosition:"center","&::before":{content:'""',position:"absolute",display:"block",width:"100%",height:"3px",background:"#FF0000",transform:"rotate(148deg)",borderRadius:"2px"}},colorLensIcon:{position:"relative",zIndex:2},popper:{zIndex:1500},topLabel:{marginBottom:"8px",fontSize:"15px",lineHeight:"17px",letterSpacing:"0.4px",color:"#BDBDBD",whiteSpace:"nowrap"},rightLabel:{marginLeft:"8px",fontSize:"16px"}},d={rgba:function(e){return"rgba(".concat(e.rgb.r,", ").concat(e.rgb.g,", ").concat(e.rgb.b,", ").concat(e.rgb.a,")")},rgb:function(e){return"rgb(".concat(e.rgb.r,", ").concat(e.rgb.g,", ").concat(e.rgb.b,")")},hex:function(e){return e.hex},rgba_rgb:function(e){return 1===e.rgb.a?d.rgb(e):d.rgba(e)},rgba_hex:function(e){return 1===e.rgb.a?d.hex(e):d.rgba(e)}},x=function(a){var g,h,f=a.label,x=a.value,v=a.converter,C=a.onChange,P=a.buttonClassName,k=a.popoverAnchorOrigin,L=a.popoverTransformOrigin,y=a.labelPosition,T=a.hideLabel,O=a.pickerComponent,R=a.classes,z=a.lensColor,S=a.enableTransparencyPalette,N=p(null),w=r(N,2),I=w[0],j=w[1],B=p(x),D=r(B,2),q=D[0],A=D[1],_=s();b((function(){A(x)}),[x]);return n("div",{className:u(R.root,(g={},e(g,R.topLabelRoot,"top"===y),e(g,R.rightLabelRoot,"right"===y),g)),children:[!T&&t(i,{className:u((h={},e(h,R.topLabel,"top"===y),e(h,R.rightLabel,"right"===y),h)),shrink:!0,children:f}),t(l,{className:u(R.button,P,e({},R.buttonTransparrent,0===o(q).alpha())),disableRipple:!0,style:{backgroundColor:q,color:z},onClick:function(e){j(e.currentTarget)},children:t(m,{fontSize:"small",className:R.colorLensIcon})}),t(c,{id:"colors-popper",action:_,open:Boolean(I),anchorEl:I,onClose:function(){j(null)},anchorOrigin:k,transformOrigin:L,children:t(O,{color:q,onChange:function(e){var r=d[v](e);A(r),C(r)},onSizeChange:function(){_.current&&_.current.updatePosition()},enableTransparencyPalette:S})})]})};x.propTypes={buttonClassName:g.string,label:g.string,value:g.string.isRequired,onChange:g.func.isRequired,converter:g.oneOf(Object.keys(d)),classes:g.shape({button:g.string.isRequired}).isRequired,pickerComponent:g.node,labelPosition:g.oneOf(["top","right"]),popoverAnchorOrigin:g.shape({}),popoverTransformOrigin:g.shape({}),hideLabel:g.bool,lensColor:g.string,enableTransparencyPalette:g.bool},x.defaultProps={label:"Color",buttonClassName:null,converter:"rgba_hex",pickerComponent:h,hideLabel:!1,popoverAnchorOrigin:{vertical:"bottom",horizontal:"left"},popoverTransformOrigin:{vertical:"top",horizontal:"left"},labelPosition:"top",lensColor:"#fff",enableTransparencyPalette:!1};var v=a(f)(x);export default v;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import e from"@babel/runtime/helpers/defineProperty";import{jsx as i}from"react/jsx-runtime";import{makeStyles as
|
|
1
|
+
import e from"@babel/runtime/helpers/defineProperty";import r from"chroma-js";import{jsx as i}from"react/jsx-runtime";import{makeStyles as o}from"@material-ui/core";import t from"prop-types";import n from"classnames";import a from"@material-ui/icons/CheckRounded";var s=o({container:{position:"relative",cursor:"pointer",width:"16px",height:"16px",borderRadius:"2px",display:"flex",justifyContent:"center",alignItems:"center","&:hover":{border:"1px solid white"}},containerSelected:{border:"1px solid white","& $squareCheck":{visibility:"visible"}},transparentContainer:{position:"relative",border:"1px solid #C4C4C4;",backgroundImage:"url(".concat("/static/media/39f55985e0da1489ad22264208b0493d.svg",")"),backgroundSize:"cover",backgroundPosition:"center","&::before":{content:'""',position:"absolute",display:"block",width:"100%",height:"2px",background:"#FF0000",transform:"rotate(135deg)",borderRadius:"2px"}},squareCheck:{width:"16px",height:"16px",color:"white",visibility:"hidden",zIndex:2}});function c(o){var t,c=o.color,d=o.isSelected,l=o.onClick,p=s();return i("div",{className:n(p.container,(t={},e(t,p.transparentContainer,0===r(c).alpha()),e(t,p.containerSelected,d),t)),style:{backgroundColor:c},onClick:l,children:i(a,{fontSize:"small",className:p.squareCheck})})}c.propTypes={color:t.string.isRequired,isSelected:t.bool.isRequired,onClick:t.func.isRequired};export default c;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as
|
|
1
|
+
import r from"chroma-js";import{jsx as e}from"react/jsx-runtime";import o from"prop-types";import a from"classnames";import{CustomPicker as t}from"react-color";import n from"../ColorSquare/ColorSquare.js";import{paletteColorsWithTransparent as s,paletteColors as l}from"./PaletteConstants.js";import i from"./Palette.css.js";var m=function(e,o){var a=r(e).alpha(),t=r(o).alpha();return a?e===o:a===t},c=function(r){var o=r.onChange,t=r.color,c=r.className,p=r.enableTransparencyPalette?s:l;return e("div",{className:a(i.paletteContainer,c),children:p.map((function(r){return e(n,{color:r,isSelected:m(t,r),onClick:function(){o(r)}},r)}))})};c.propTypes={onChange:o.func.isRequired,color:o.string.isRequired,className:o.string,enableTransparencyPalette:o.bool.isRequired},c.defaultProps={className:null};var p=t(c);export default p;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
var f=["#9b2310","#ac5d09","#a99704","#6f920d","#408e00","#05907b","#028597","#295abb","#4d2fbf","#8a1caa","#921d48","#445f6c","#000000","#eb3f24","#ff8200","#ffe300","#b9ed24","#7eed24","#1edcc1","#00e0ff","#558dfc","#714cff","#cc2afb","#f6377c","#738e9d","#
|
|
1
|
+
var f=["#c4c4c4","#9b2310","#ac5d09","#a99704","#6f920d","#408e00","#05907b","#028597","#295abb","#4d2fbf","#8a1caa","#921d48","#445f6c","#000000","#eb3f24","#ff8200","#ffe300","#b9ed24","#7eed24","#1edcc1","#00e0ff","#558dfc","#714cff","#cc2afb","#f6377c","#738e9d","#ffffff","#fe8977","#fbb368","#fff17f","#d6ff61","#b9ff81","#78feea","#79efff","#97baff","#ad99fb","#e488ff","#ff87b3","#bbc6cc"],c="#00000000",b=f.map((function(f,c){return 0===c?"#00000000":f}));export{c as TRANSPARENT_HEX,f as paletteColors,b as paletteColorsWithTransparent};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import o from"@babel/runtime/helpers/defineProperty";import e from"@babel/runtime/helpers/slicedToArray";import{jsxs as
|
|
1
|
+
import o from"@babel/runtime/helpers/defineProperty";import e from"@babel/runtime/helpers/slicedToArray";import{jsxs as r,jsx as i}from"react/jsx-runtime";import{makeStyles as t,Tooltip as n,IconButton as a}from"@material-ui/core";import{forwardRef as l,useState as c,useLayoutEffect as p}from"react";import d from"prop-types";import s from"classnames";import{ChromePicker as m}from"react-color";import b from"@material-ui/icons/Palette";import f from"@material-ui/icons/Colorize";import u from"./Palette/Palette.js";var h="PALETTE",x="CHROME_PICKER",g={default:{picker:{width:"100%",boxShadow:"none"},body:{backgroundColor:"#3b3b3b",padding:"16px 16px 0"},color:{width:"32px",height:"32px",marginRight:"16px",borderRadius:"2px"},swatch:{marginTop:0,width:"100%",height:"100%",borderRadius:0,position:"relative",overflow:"hidden"},toggles:{display:"flex",flexDirection:"column",justifyContent:"space-between"},Alpha:{checkboard:{display:"none"},gradient:{borderRadius:"5px"}}}},C=t({container:{backgroundColor:"#3b3b3b",boxShadow:"0px 3px 10px rgba(0, 0, 0, 0.4)",width:"250px",paddingBottom:"8px",borderRadius:"4px","& input":{border:"1px solid #616161 !important",backgroundColor:"#3b3b3b",color:"#fff !important",boxShadow:"none !important",outline:"none"},"& svg:not(.MuiSvgIcon-root)":{fill:"#bdbdbd !important"}},chomePickerPalette:{margin:"0 8px",paddingTop:"8px"},buttonsContainer:{display:"flex",justifyContent:"center",marginTop:"8px"},iconButton:{padding:"8px","&:hover":{backgroundColor:"#333333"},"&:hover $icon":{color:"#fff"}},icon:{color:"#bdbdbd",fontSize:"24px"},iconActive:{color:"#fff"},tooltip:{background:"#414141",color:"#fff",boxShadow:"0px 4px 4px rgba(0, 0, 0, 0.12)",borderRadius:"4px",opacity:1,fontSize:"11px"}}),y=l((function(t,l){var d=t.color,y=t.onChange,P=t.onSizeChange,v=t.enableTransparencyPalette,k=C(),w=c(h),R=e(w,2),S=R[0],T=R[1];return p(P,[S]),r("div",{className:k.container,ref:l,children:[S===h&&i(u,{className:k.chomePickerPalette,color:d,onChange:y,enableTransparencyPalette:v}),S===x&&i(m,{styles:g,color:d,onChange:y}),r("div",{className:k.buttonsContainer,children:[i(n,{title:"Palette",classes:{tooltip:k.tooltip},children:i(a,{className:k.iconButton,onClick:function(){return T(h)},children:i(b,{className:s(k.icon,o({},k.iconActive,S===h)),fontSize:"small"})})}),i(n,{title:"Pick your own",classes:{tooltip:k.tooltip},children:i(a,{className:k.iconButton,onClick:function(){return T(x)},children:i(f,{className:s(k.icon,o({},k.iconActive,S===x)),fontSize:"small"})})})]})]})}));y.propTypes={color:d.string.isRequired,onChange:d.func.isRequired,onSizeChange:d.func.isRequired,enableTransparencyPalette:d.bool.isRequired};export default y;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import r from"@babel/runtime/helpers/defineProperty";import o from"@babel/runtime/helpers/slicedToArray";import{jsx as e}from"react/jsx-runtime";import{makeStyles as t,Tooltip as i,IconButton as
|
|
1
|
+
import r from"@babel/runtime/helpers/defineProperty";import o from"@babel/runtime/helpers/slicedToArray";import{jsx as e}from"react/jsx-runtime";import{makeStyles as t,Tooltip as i,IconButton as a}from"@material-ui/core";import{useState as n}from"react";import l from"prop-types";import c from"classnames";function p(r,o){var e=Object.keys(r);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(r);o&&(t=t.filter((function(o){return Object.getOwnPropertyDescriptor(r,o).enumerable}))),e.push.apply(e,t)}return e}function s(o){for(var e=1;e<arguments.length;e++){var t=null!=arguments[e]?arguments[e]:{};e%2?p(Object(t),!0).forEach((function(e){r(o,e,t[e])})):Object.getOwnPropertyDescriptors?Object.defineProperties(o,Object.getOwnPropertyDescriptors(t)):p(Object(t)).forEach((function(r){Object.defineProperty(o,r,Object.getOwnPropertyDescriptor(t,r))}))}return o}var u=t((function(r){return{root:{color:r.palette.primary.text6,padding:6,"&:hover":{color:"#FFFFFF",backgroundColor:r.palette.background.b7,"&.MuiIconButton-colorPrimary":{color:r.palette.primary.main}},"&:active":{color:"#FFFFFF","&.MuiIconButton-colorPrimary":{color:r.palette.primary.main}},"&.Mui-disabled":{pointerEvents:"all",opacity:.4,color:"#FFFFFF","&.MuiIconButton-colorPrimary":{color:r.palette.primary.main}},"& .MuiSvgIcon-root":{color:"inherit",fontSize:"inherit"}},colorPrimary:{color:r.palette.primary.main},sizeSmall:{fontSize:16,padding:7},sizeLarge:{"&.MuiButtonBase-root":{padding:8}},contained:{backgroundColor:r.palette.background.b9},containedDisabled:{"&.MuiButtonBase-root":{backgroundColor:r.palette.background.b9}},tooltip:{top:"-10px !important"}}})),m=function(t){var l,p=t.size,m=t.variant,d=t.tooltipProps,b=t.classes,f=void 0===b?{}:b,y=u(),g=n(!1),O=o(g,2),P=O[0],F=O[1],v=s(s({},f),{},{root:c(f.root,y.root,(l={},r(l,y.sizeLarge,"large"===p),r(l,y.contained,"contained"===m),l)),disabled:c(f.disabled,r({},y.containedDisabled,"contained"===m)),colorPrimary:c(f.colorPrimary,y.colorPrimary),sizeSmall:c(f.sizeSmall,y.sizeSmall)});return d.title?e(i,s(s({},d),{},{open:P,children:e(a,s({classes:v,onMouseOver:function(){return F(!0)},onMouseOut:function(){return F(!1)}},t))})):e(a,s({classes:v},t))};m.propTypes={size:l.oneOf(["small","medium","large"]),variant:l.oneOf(["default","contained"]),tooltipProps:l.shape({title:l.string}),disabled:l.bool},m.defaultProps={size:"medium",variant:"default",tooltipProps:{title:void 0},disabled:!1};export default m;
|