@kwantis-id3/frontend-library 0.21.0 → 0.22.0-rc.0

package/changelog.md

@@ -1,10 +1,18 @@
+# v0.22.0
+## Minor Changes
+- Dropdown Items now accept a isHidden prop
+- Dropdown Items now accept a closeOnClick prop that can be used to close the dropdown when the item is clicked
+
+## Patch Changes
+- Fixed input field font family
+
+ 
 # v0.21.0
 ##  Minor Changes
 - Now the `ThemeContextProps` interface is exported, so that it can be used to type the `useTheme` hook return value.
 - Refactored the styling of the `Dropdown` component. It's cleaner and more readable now, both in mobile and desktop view.
 
  
-
 # v0.20.3
 ## Patch Changes
 - Fixed `isDefaultOpen` prop

package/dist/esm/index.js

@@ -86,7 +86,7 @@ import*as e from"react";import t,{useLayoutEffect as u,useContext as n,createEle
   border: ${({$isDisabled:e})=>e?"1px solid #e6e6e6":"1px solid #cccccc"};
   padding: 0px 10px;
   border-radius: 4px;
-  font-family: "Roboto";
+  font-family: inherit;
   font-size: 16px;
   color: #333333;
   width: calc(100% - 22px);
@@ -268,7 +268,7 @@ import*as e from"react";import t,{useLayoutEffect as u,useContext as n,createEle
   color: inherit;
   text-align: ${e=>"left"===e.$direction?"right":"left"};
   white-space: pre-wrap;
-`;var Ea={};Object.defineProperty(Ea,"__esModule",{value:!0});var ya=Ea.chevronDown=void 0;ya=Ea.chevronDown={viewBox:"0 0 1792 1792",children:[{name:"path",attribs:{d:"M1683 808l-742 741q-19 19-45 19t-45-19l-742-741q-19-19-19-45.5t19-45.5l166-165q19-19 45-19t45 19l531 531 531-531q19-19 45-19t45 19l166 165q19 19 19 45.5t-19 45.5z"}}]};var Ia={};Object.defineProperty(Ia,"__esModule",{value:!0});var Fa=Ia.chevronRight=void 0;Fa=Ia.chevronRight={viewBox:"0 0 1280 1792",children:[{name:"path",attribs:{d:"M1107 877l-742 742q-19 19-45 19t-45-19l-166-166q-19-19-19-45t19-45l531-531-531-531q-19-19-19-45t19-45l166-166q19-19 45-19t45 19l742 742q19 19 19 45t-19 45z"}}]};var Ba={};Object.defineProperty(Ba,"__esModule",{value:!0});var xa=Ba.chevronLeft=void 0;xa=Ba.chevronLeft={viewBox:"0 0 1280 1792",children:[{name:"path",attribs:{d:"M1171 301l-531 531 531 531q19 19 19 45t-19 45l-166 166q-19 19-45 19t-45-19l-742-742q-19-19-19-45t19-45l742-742q19-19 45-19t45 19l166 166q19 19 19 45t-19 45z"}}]};var Da={};Object.defineProperty(Da,"__esModule",{value:!0});var wa=Da.minus=void 0;wa=Da.minus={viewBox:"0 0 1408 1792",children:[{name:"path",attribs:{d:"M1408 736v192q0 40-28 68t-68 28h-1216q-40 0-68-28t-28-68v-192q0-40 28-68t68-28h1216q40 0 68 28t28 68z"}}]};const Oa=e=>{var u,n;const[r,o]=t.useState(!1),i=Gu(),a=i.getColor(null!==(u=e.color)&&void 0!==u?u:"white"),s=e.color?Ut(i.getColor(e.color).main).darken(20).toString():i.colors.secondary.main,c=t.useRef(null);return d((()=>()=>{c.current&&clearTimeout(c.current)}),[]),St(da,Object.assign({onMouseLeave:()=>c.current=setTimeout((()=>{o(!1)}),300),onMouseEnter:()=>{c.current&&(clearTimeout(c.current),c.current=null)}},{children:[kt(pa,Object.assign({onClick:()=>o((e=>!e))},{children:e.trigger})),kt(ga,Object.assign({$direction:null!==(n=e.direction)&&void 0!==n?n:"left",$isOpen:r,$bgColor:a.main},{children:e.content.map((t=>{var u,n;return Vt(Ga,Object.assign({},t,{color:null!==(u=t.color)&&void 0!==u?u:a.main,hoverColor:null!==(n=e.hoverColor)&&void 0!==n?n:s,direction:e.direction,key:t.value}))}))}))]}))},Ga=e=>{var t,u,n;const r=Gu(),o=r.getColor(null!==(t=e.color)&&void 0!==t?t:"white"),i=r.getColor(e.hoverColor),a=e.color?Ut(r.getColor(e.color).main).darken(20).toString():r.colors.secondary.main,s=e.textColor?r.getColor(e.textColor).main:o.contrastText;return St(fa,Object.assign({onClick:t=>{e.onClick&&e.onClick(),t.stopPropagation()},$bgColor:o.main,$textColor:s,$hoverColor:i.main,$hoverTextColor:i.contrastText,$direction:null!==(u=e.direction)&&void 0!==u?u:"left"},{children:[(c=e.value,l=null!==(n=e.direction)&&void 0!==n?n:"left",d=!!e.children,d?St(va,"right"===l?Object.assign({$direction:l,$hasChildren:!0},{children:[c,kt(zn,{icon:Fa,size:10})]}):Object.assign({$direction:l,$hasChildren:!0},{children:[kt(zn,{icon:xa,size:10}),c]})):kt(va,Object.assign({$direction:l,$hasChildren:!1},{children:c}))),e.children&&kt("div",Object.assign({className:"dropdownChildrenContainer"},{children:e.children.map((t=>{var u,n,r;return Vt(Ga,Object.assign({},t,{color:null!==(n=null!==(u=t.color)&&void 0!==u?u:e.color)&&void 0!==n?n:"white",hoverColor:null!==(r=e.hoverColor)&&void 0!==r?r:a,direction:e.direction,key:t.value}))}))}))]}));var c,l,d},Ta=e=>{var u;const[n,r]=t.useState(!1),o=Gu(),i=e.color?Ut(o.getColor(e.color).main).darken(20).toString():o.colors.secondary.main;return St(da,{children:[kt(pa,Object.assign({onClick:()=>r((e=>!e))},{children:e.trigger})),kt(ba,Object.assign({$isOpen:n,$bgColor:o.getColor(null!==(u=e.color)&&void 0!==u?u:"white").main},{children:e.content.map((t=>{var u,n,r;return Vt(Na,Object.assign({},t,{color:null!==(n=null!==(u=t.color)&&void 0!==u?u:e.color)&&void 0!==n?n:"white",hoverColor:null!==(r=e.hoverColor)&&void 0!==r?r:i,direction:e.direction,key:t.value}))}))}))]})},Na=e=>{var u;const[n,r]=t.useState(!1),o=Gu(),i=o.getColor(null!==(u=e.color)&&void 0!==u?u:"white"),a=e.color?Ut(o.getColor(e.color).main).darken(20).toString():o.colors.secondary.main,s=o.getColor(e.hoverColor),c=e.textColor?o.getColor(e.textColor).main:i.contrastText;return kt(ha,Object.assign({$bgColor:i.main,$textColor:c},{children:e.children?kt("div",Object.assign({style:{width:"100%"}},{children:kt(nr,Object.assign({onClick:()=>{r((e=>!e))},color:c,title:e.value,isOpen:n,hideDivider:!0,customTrigger:(t=>kt(Aa,Object.assign({onClick:()=>{e.onClick&&e.onClick()}},{children:St(Ca,Object.assign({$bgColor:t.main,$textColor:t.contrastText},{children:[kt(zn,{icon:n?ya:Fa,size:12}),kt("span",{children:e.value})]}))})))(n?s:i)},{children:kt(ma,{children:e.children&&e.children.map((t=>{var u,n,r;return Vt(Na,Object.assign({},t,{color:null!==(n=null!==(u=t.color)&&void 0!==u?u:e.color)&&void 0!==n?n:"primary",hoverColor:null!==(r=e.hoverColor)&&void 0!==r?r:a,direction:e.direction,key:t.value}))}))})}))})):kt(Aa,Object.assign({onClick:()=>{e.onClick&&e.onClick()}},{children:St(Ca,{children:[kt(zn,{icon:wa,size:12}),kt("span",{children:e.value})]})}))}))},ka=e=>{const t=Tu(e.mobileBreakpoint);return kt(Nt,{children:kt(t?Ta:Oa,Object.assign({},e))})};var Sa={};Object.defineProperty(Sa,"__esModule",{value:!0});var Va=Sa.ic_close=void 0;Va=Sa.ic_close={viewBox:"0 0 24 24",children:[{name:"path",attribs:{d:"M0 0h24v24H0z",fill:"none"},children:[]},{name:"path",attribs:{d:"M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"},children:[]}]};const Ra=Hu.dialog`
+`;var Ea={};Object.defineProperty(Ea,"__esModule",{value:!0});var ya=Ea.chevronDown=void 0;ya=Ea.chevronDown={viewBox:"0 0 1792 1792",children:[{name:"path",attribs:{d:"M1683 808l-742 741q-19 19-45 19t-45-19l-742-741q-19-19-19-45.5t19-45.5l166-165q19-19 45-19t45 19l531 531 531-531q19-19 45-19t45 19l166 165q19 19 19 45.5t-19 45.5z"}}]};var Ia={};Object.defineProperty(Ia,"__esModule",{value:!0});var Fa=Ia.chevronRight=void 0;Fa=Ia.chevronRight={viewBox:"0 0 1280 1792",children:[{name:"path",attribs:{d:"M1107 877l-742 742q-19 19-45 19t-45-19l-166-166q-19-19-19-45t19-45l531-531-531-531q-19-19-19-45t19-45l166-166q19-19 45-19t45 19l742 742q19 19 19 45t-19 45z"}}]};var Ba={};Object.defineProperty(Ba,"__esModule",{value:!0});var xa=Ba.chevronLeft=void 0;xa=Ba.chevronLeft={viewBox:"0 0 1280 1792",children:[{name:"path",attribs:{d:"M1171 301l-531 531 531 531q19 19 19 45t-19 45l-166 166q-19 19-45 19t-45-19l-742-742q-19-19-19-45t19-45l742-742q19-19 45-19t45 19l166 166q19 19 19 45t-19 45z"}}]};var Da={};Object.defineProperty(Da,"__esModule",{value:!0});var wa=Da.minus=void 0;wa=Da.minus={viewBox:"0 0 1408 1792",children:[{name:"path",attribs:{d:"M1408 736v192q0 40-28 68t-68 28h-1216q-40 0-68-28t-28-68v-192q0-40 28-68t68-28h1216q40 0 68 28t28 68z"}}]};const Oa=e=>{var u,n;const[r,o]=t.useState(!1),i=Gu(),a=i.getColor(null!==(u=e.color)&&void 0!==u?u:"white"),s=e.color?Ut(i.getColor(e.color).main).darken(20).toString():i.colors.secondary.main,c=t.useRef(null);return d((()=>()=>{c.current&&clearTimeout(c.current)}),[]),St(da,Object.assign({onMouseLeave:()=>c.current=setTimeout((()=>{o(!1)}),300),onMouseEnter:()=>{c.current&&(clearTimeout(c.current),c.current=null)}},{children:[kt(pa,Object.assign({onClick:()=>o((e=>!e))},{children:e.trigger})),kt(ga,Object.assign({$direction:null!==(n=e.direction)&&void 0!==n?n:"left",$isOpen:r,$bgColor:a.main},{children:e.content.map((t=>{var u,n;return Vt(Ga,Object.assign({},t,{color:null!==(u=t.color)&&void 0!==u?u:a.main,hoverColor:null!==(n=e.hoverColor)&&void 0!==n?n:s,direction:e.direction,key:t.value,closeBody:()=>o(!1)}))}))}))]}))},Ga=e=>{var t,u,n;const r=Gu(),o=r.getColor(null!==(t=e.color)&&void 0!==t?t:"white"),i=r.getColor(e.hoverColor),a=e.color?Ut(r.getColor(e.color).main).darken(20).toString():r.colors.secondary.main,s=e.textColor?r.getColor(e.textColor).main:o.contrastText;return kt(Nt,{children:!e.isHidden&&St(fa,Object.assign({onClick:t=>{e.onClick&&(e.onClick(),e.closeOnClick&&e.closeBody()),t.stopPropagation()},$bgColor:o.main,$textColor:s,$hoverColor:i.main,$hoverTextColor:i.contrastText,$direction:null!==(u=e.direction)&&void 0!==u?u:"left"},{children:[(c=e.value,l=null!==(n=e.direction)&&void 0!==n?n:"left",d=!!e.children,d?St(va,"right"===l?Object.assign({$direction:l,$hasChildren:!0},{children:[c,kt(zn,{icon:Fa,size:10})]}):Object.assign({$direction:l,$hasChildren:!0},{children:[kt(zn,{icon:xa,size:10}),c]})):kt(va,Object.assign({$direction:l,$hasChildren:!1},{children:c}))),e.children&&kt("div",Object.assign({className:"dropdownChildrenContainer"},{children:e.children.map((t=>{var u,n,r;return Vt(Ga,Object.assign({},t,{color:null!==(n=null!==(u=t.color)&&void 0!==u?u:e.color)&&void 0!==n?n:"white",hoverColor:null!==(r=e.hoverColor)&&void 0!==r?r:a,direction:e.direction,key:t.value,closeBody:e.closeBody}))}))}))]}))});var c,l,d},Ta=e=>{var u;const[n,r]=t.useState(!1),o=Gu(),i=e.color?Ut(o.getColor(e.color).main).darken(20).toString():o.colors.secondary.main;return St(da,{children:[kt(pa,Object.assign({onClick:()=>r((e=>!e))},{children:e.trigger})),kt(ba,Object.assign({$isOpen:n,$bgColor:o.getColor(null!==(u=e.color)&&void 0!==u?u:"white").main},{children:e.content.map((t=>{var u,n,o;return Vt(Na,Object.assign({},t,{color:null!==(n=null!==(u=t.color)&&void 0!==u?u:e.color)&&void 0!==n?n:"white",hoverColor:null!==(o=e.hoverColor)&&void 0!==o?o:i,direction:e.direction,key:t.value,closeBody:()=>r(!1)}))}))}))]})},Na=e=>{var u;const[n,r]=t.useState(!1),o=Gu(),i=o.getColor(null!==(u=e.color)&&void 0!==u?u:"white"),a=e.color?Ut(o.getColor(e.color).main).darken(20).toString():o.colors.secondary.main,s=o.getColor(e.hoverColor),c=e.textColor?o.getColor(e.textColor).main:i.contrastText;return kt(Nt,{children:!e.isHidden&&kt(ha,Object.assign({$bgColor:i.main,$textColor:c},{children:e.children?kt("div",Object.assign({style:{width:"100%"}},{children:kt(nr,Object.assign({onClick:()=>{r((e=>!e))},color:c,title:e.value,isOpen:n,hideDivider:!0,customTrigger:(t=>kt(Aa,Object.assign({onClick:()=>{e.onClick&&e.onClick()}},{children:St(Ca,Object.assign({$bgColor:t.main,$textColor:t.contrastText},{children:[kt(zn,{icon:n?ya:Fa,size:12}),kt("span",{children:e.value})]}))})))(n?s:i)},{children:kt(ma,{children:e.children&&e.children.map((t=>{var u,n,r;return Vt(Na,Object.assign({},t,{color:null!==(n=null!==(u=t.color)&&void 0!==u?u:e.color)&&void 0!==n?n:"primary",hoverColor:null!==(r=e.hoverColor)&&void 0!==r?r:a,direction:e.direction,key:t.value,closeBody:e.closeBody}))}))})}))})):kt(Aa,Object.assign({onClick:()=>{e.onClick&&(e.onClick(),e.closeOnClick&&e.closeBody())}},{children:St(Ca,{children:[kt(zn,{icon:wa,size:12}),kt("span",{children:e.value})]})}))}))})},ka=e=>{const t=Tu(e.mobileBreakpoint);return kt(Nt,{children:kt(t?Ta:Oa,Object.assign({},e))})};var Sa={};Object.defineProperty(Sa,"__esModule",{value:!0});var Va=Sa.ic_close=void 0;Va=Sa.ic_close={viewBox:"0 0 24 24",children:[{name:"path",attribs:{d:"M0 0h24v24H0z",fill:"none"},children:[]},{name:"path",attribs:{d:"M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"},children:[]}]};const Ra=Hu.dialog`
   label: DialogElement;
   border: none;
   border-radius: 8px;